5

I did some tests on Chrome and requestAnimationFrame yielded 61 fps while setTimeOut( callback, 0 ), yielded 233 fps.
If one would like to have more than 61 fps (which I'm not sure what for) but wouldn't it be better to render with setTimeOut and just use requestAnimationFrame to detect when the window lost focus and then stop the timeouts until the focus returns?

And a side question: is there another way to detect when the window loses focus other than requestAnimationFrame not calling the callback?

Petruza
  • 11,744
  • 25
  • 84
  • 136

1 Answers1

12

Request animation frame is in sync with your monitors refresh rate (there is no use to animate more frames than you are actually showing on screen)

Here is a reference from the mozilla docs: https://developer.mozilla.org/en/DOM/Animations_using_MozBeforePaint

Frame rate control

MozBeforePaint won't fire more than a fixed number of times per second, e.g. 50 or 60. This is intentional, because modern operating systems and hardware won't let the browser display more frames than that anyway. Limiting the frame rate avoids wasting work, thereby saving CPU usage and power and improving overall system performance.

Daniel Kurka
  • 7,973
  • 2
  • 24
  • 43