Better animation method than requestAnimationFrame for JavaScript?

Question

Everywhere I see the advice to use requestAnimationFrame. What nobody tells you is that Chrome will throttle to 48 or 30fps based on your power plan, how many tabs you have open, and the phase of the moon, without notifying you in any way. It will do this regardless of the actual work load you're doing.

For an actual animation, this is fine, if suboptimal. You use the elapsed time to generate a new frame of animation independent of frame rate.

But for something like an emulator it's unacceptable.

I'm using SharedArrayBuffers, so I've already got the annoying headers included with my JavaScript that lets you use a few extra API's. Is there any alternative to requestAnimationFrame or any way to force it to actually go at least 60Hz?

Answer 1

No there is no alternative, since the browser's paint job executes as many times as the requestAnimationFrame callback is called (when you keep scheduling it at each next call). So if you would do more frequent iterations somehow, it wouldn't help, as some of these changes wouldn't make it to the display.

If the issue is about timing , then realise that the callback is called with a timestamp, which can help you do realistic calculations. This doesn't change the varying frame rate, but at least allows you to know how much time has passed and base your calculations on that and not on the number of times that the callback is called.