Suppose I have several animations (functions that change something), In general, I can simply write requestAnimationFrame(functionName) in each of them, run them when the page loads, thus it turns out that requestAnimationFrame is called many times and I don’t know well or bad (I worked with setInterval and there it is naturally bad). Or I can make a function like this:
on.frame = (function () { var fns = []; function frame () { var now = new Date(); for ( let i = 0; i < fns.length; i++ ) fns[i](now); if (fns.length != 0) requestAnimationFrame(frame); } return function (fn) { if(fns.length == 0){ fns.push(fn); requestAnimationFrame(frame); } else fns.push(fn); } })(); The point is to create an array with animations and execute them all in one function that is thrust into one requestAnimationFrame . Is it worth doing? After all, as far as I understand, requestAnimationFrame collects everything from the beginning that should change and then executes together.
