Spring physics

Vizzele doesn't use durations and easing curves for motion. It uses springs: a mass pulled toward a target by a spring and slowed by friction. You never tell it how long to take — you tell it how it feels, and the time falls out of the physics. Interrupt a spring halfway and it keeps its velocity, which is why everything feels continuous.

The three knobs

• Stiffness — how hard the spring pulls. Higher = faster and snappier.
• Damping — friction. Low damping wobbles; high damping glides in without overshoot.
• Mass — weight. Heavier objects take longer to get going and overshoot more.

Exact at any frame rate

Most libraries integrate springs step by step, so a dropped frame changes the motion. Vizzele solves the damped-oscillator equation in closed form: position and velocity are computed exactly for whatever time has passed. 30 fps, 60 fps or 144 fps — the curve is the same.

import { Spring, springs } from '@vizzele/core';

const x = new Spring({ ...springs.jelly, onUpdate: (v) => (el.style.translate = `${v}px`) });
x.set(240);                       // animate
x.set(0, { velocity: -3000 });    // retarget mid-flight, with a kick

Inertia

When you release a dragged element, its velocity becomes an exponential glide — the same model as momentum scrolling. If it would cross a boundary, the glide hands over to a spring that bounces it back. Snap points bend the glide so it lands exactly on a point.