Springs being as versatile as ever

When i published Why React needed yet another animation library. Introducing: react-spring what feels like an eternity ago, i had no idea the library would grow into what it is today. It is reaching 8.000 stars on Github, powers 1.300 projects and over 60 dependencies. It reached 26.000 downloads per week on npm. Considering that i made it initially for myself i didn’t expect much when sharing it, but i am more than happy to see that it enables others as well to cast ideas into motion.

People have been very kind, helping out, funding a little, suggesting things or adding issues — and so far it’s been quite nice for open source, which, as you know, can also take graver turns.

So it’s that time again, i’ve been testing limits, took polls, collected all sorts of suggestions and ideas. And a while ago i started preparing a major. Of course i had no idea that i would end up writing the thing from scratch. The changes this time around are massive, though i kept api changes to a minimum in order to not create a situation that would cause painful upgrades.

The focus of react-spring remains untouched: no magic, simplicity and declarative expression.

Transitions have a more straight forward api

I am still certain that this is the best way to animate. I loved the way react-motion used render-props, handing out interpolated values instead of masking animations with wrapper-components doing magic things in the background. And of course how the animated library could bypass React when animating and interpolate complex data was also a big influence. Both are still the main inspiration.

The main focus of the release were features and suggestions that came up over time. A full overview can be found here: https://github.com/drcmda/react-spring/releases/tag/v6.0.0

In essence, react-spring 6.0 has further reduced the underlying animated underpinnings, making it faster (by sharing one combined requestAnimationFrame-loop per spring), more flexible and a little bit leaner, too. It runs on a different spring mechanism as well (from RK4 to SEE).

As well as Trails

Further additions were slight api changes in order to make it less confusing in some edge cases, lots and lots of new features and capabilities that are too many to list here, inbuilt durations, multistage and trailing transitions, being able to reverse animation, end-state props that are applied after animations conclude (good for settings display: ‘hidden’ and things like that), and so on.

Last but not least i’ve used docz to document the api. There are lots of small examples and playgrounds to toy with now: http://react-spring.surge.sh and i hope this makes it easier for beginners to start.