SetTimeOut gives 233 fps, whereas requestAnimationFrame gives 61

Question

I did some tests in Chrome and requestAnimationFrame gave 61 fps and setTimeOut( callback, 0 ) - 233 fps.
If you want to have more than 61 fps (which I'm not sure why), but would it not be better to display using setTimeOut and just use requestAnimationFrame to detect when the window has lost focus and then stop timeouts until focus returns?

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

Answer 1

The request for an animation frame is synchronized with the refresh rate of the monitors (there is no need to animate more frames than you actually display on the screen)

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

Frame rate control

MozBeforePaint will not launch more than a fixed number of times in the second, for example, 50 or 60. This is intentional, as modern operating systems and hardware will not allow the browser to display more frames than this anyway. Limiting the frame rate avoids wasteful work, thereby saving processor consumption and power and improving overall system performance.