DEV Community


Discussion on: How to process heavy workloads AND animate at 60fps in Vanilla JS, any Framework or React Native:

gregfletcher profile image
Greg Fletcher

Very cool!

I've had a quick peek at the source code. Do you exclusively use requestAnimationFrame for the animations? I noticed you also have setTimeOut as well but I wasn't sure if you use that as well.

Also what are your thoughts on using a service worker for off the main thread animations?

miketalbot profile image
Mike Talbot Author

So the animations use requestAnimationFrame - the key thing being to use generators to create imperative for next loops in that case.

The processing stuff uses requestIdleCallback. I polyfill that in a variety of ways.

The problem with other threads is the effort of moving things to and from them, so if the animation was basically a ton of processing that resulted in something simple and small enough to move then it would work. I'm thinking some kind of complex particle simulation or 3d work.