对于哪些浏览器我们使用Paul Irish的requestAnimationFrame垫片？

Question

Paul Irish有一个名为requestAnimationFrame的帖子,用于智能动画.现在保罗是一个聪明人 - 我只是想了解这个想法的应用范围.

他说要做HTML5动画 - 你应该像这样使用requestAnimationFrame垫片:

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


// usage:
// instead of setInterval(render, 16) ....

(function animloop(){
  requestAnimFrame(animloop);
  render();
})();
// place the rAF *before* the render() to assure as close to
// 60fps with the setTimeout fallback.

这是可以理解的.我们可以在这样的JSFiddle中应用它,结果非常好.

但如果我撕掉垫片层功能,那么在Chrome 31和Firefox 24中它可以正常工作.

因此,如果我查看RequestAnimationFrame函数的兼容性 - 看起来好像浏览器已经有很长时间了.

我的问题是 - 对于哪些浏览器我们使用Paul Irish的requestAnimationFrame垫片？你可以把它撕掉它仍然可以工作,看起来浏览器已经有很长一段时间了.

Answer 1

你需要IE8,IE9,Android浏览器的polyfill,以及一些你必须做出判断调用的旧东西.

这是目前对rAF的支持,感谢caniuse.com:

角落里任何带有黄旗的东西都使用前缀,所以它需要垫片.任何红色都需要setTimeout回退.

但是,为了达到你的核心点......很快,是的,很快,polyfill将会更小.希望不会太久我们可以杀死它并直接使用rAF.

Answer 2

如果你想支持旧的浏览器,我担心polyfill /垫片是必要的.

正如您所指出的,它适用于最新的Firefox和Chrome,没有前缀.Firefox也有一项新的政策,不会为任何未来的技术添加前缀,所以这也许是一件好事,并且有人建议为Chrome做同样的事情.

但是如果您运行较旧的浏览器(并且有大量用户使用),则填充是必要的.

资源

在这里我们看到IE9在顶部,然后是IE8,10,然后是较旧的Chrome版本(虽然这包括整个去年解释Chrome部分以及IE9和IE10).变更可能适用于地区,因此请测试您认为应用程序相关的地理区域.