requestAnimationFrame is a special timer function that is designed for running Javascript animations. It should run 60 times per second (aka 60FPS) but the browser will adapt its frequency based on the current load.

Paul Irish wrote this simple Javascript shim in 2011, but we still need it today due to vendor prefixes.

// shim layer with setTimeout fallback
var animationTimeout = (function () {
  return window.requestAnimationFrame ||
  window.webkitRequestAnimationFrame ||
  window.mozRequestAnimationFrame ||
  window.msRequestAnimationFrame ||
  function(callback){ window.setTimeout(callback, 1000/60); };
})();

rAF usage is slightly different from setInterval/setTimeout.

function myAnimation () {
  // your code logic here...
  // call animationTimeout to loop
  animationTimeout(myAnimation);
}
myAnimation();

Moreover, you can also use it as a quick timeout:

animationTimeout(function () {
  // do some stuff after ~16ms
})