Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
requestAnimFrame() shim.
// see
// shim layer with setTimeout fallback
// chrome shipped without the time arg in m10
var timeundefined = false;
if (window.webkitRequestAnimationFrame){
timeundefined = (time == undefined);
window.requestAnimFrame = (function(){
return window.requestAnimationFrame ||
(window.webkitRequestAnimationFrame && !timeundefined) ||
window.mozRequestAnimationFrame ||
window.oRequestAnimationFrame ||
window.msRequestAnimationFrame ||
function(callback, element){
callback(+new Date);
}, 1000 / 60);
Copy link

paulirish commented Apr 29, 2011

claritysource left this comment but deleted it....

If I'm not mistaken, the original code has the following bugs:

  1. (window.webkitRequestAnimationFrame && !timeundefined) evaluates to a Boolean, not a function.
  2. Line 16 will likely be called before line 11, upon which it depends.
  3. In the fallback case, the callback will not be called at 60 frames per second, because the time the callback takes is not factored into the interval. Also, from what I understand, browsers are free to pad setTimeout() with an arbitrary amount of time, making the interval even more error-prone.

Copy link

paulirish commented Sep 7, 2011

I've since updated this gist to remove the timeundefined issue as it was specific to Chrome 10 which is now dead and gone. hooray for software updates!

Copy link

paulirish commented May 11, 2012

Don't use this

use this:

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment