loading code fetching the highlighted snippet
FIG-001/ HOOK
one timeline, many motions.
useTime() returns a motion value of ms since the hook mounted. Derive position, rotation, scale, and colour from the same source — they all stay in lockstep because they share one clock.
-
useTime()ticks every frame from mount. Reading$timein a derived store re-runs the deriver on every update, so the orb's transform and colour update at display refresh rate. - Five independent derived stores feed one element — different periods (
t / 1000vst / 1200) give Lissajous-style motion, but they're guaranteed in phase because they share the same clock. - Prefer
useTransformoverderivedwhen you want motion's interpolation machinery (clamping, output ranges). For plain math, thesvelte/storehelper is more familiar and equally fast.
0s
category · hook
sheet · sheet 01 / 01
⟳ to re-run