The spring function is an alternative to tweened that often works better for values that are frequently changing.
In this example we have two stores — one representing the circle's coordinates, and one representing its size. Let's convert them to springs:
<script>import{ spring }from'svelte/motion';let coords =spring({ x:50, y:50});let size =spring(10);</script>
Both springs have default stiffness and damping values, which control the spring's, well... springiness. We can specify our own initial values:
let coords =spring({ x:50, y:50},{
stiffness:0.1,
damping:0.25});
Waggle your mouse around, and try dragging the sliders to get a feel for how they affect the spring's behaviour. Notice that you can adjust the values while the spring is still in motion.