Javascript requestAnimationFrame的最新多边形填充

告诉我最近（Chrome 20）requestAnimationFrame获得了一个新的亚毫秒精度计时器，我必须更新代码以支持它

---

环顾四周的各种多边形填充，它们似乎都早于此更新。它们是某种功能性的（我不这么认为），还是根本没有最新的？我是否应该自己进行计时（似乎有点浪费）。

高分辨率计时的更改只会影响回调的参数。我不相信任何多边形填充都会显式引用该参数，它只是取决于您如何使用它。因此，多边形填充不需要更新，应该已经可以正常工作了-只是要小心如何将参数用于RAF回调，如果不这样做，就没什么好担心的了

保罗·爱尔兰（Paul Irish）建议对此进行多填充

window.requestAminFrame = (function(){
    return window.requestAminFrame || window.webkitRequestAnimFrame || window.mozRequestAnimFrame || window.msRequestAnimFrame || window.oRequestAnimFrame || function(func){return setTimeout(func,1/60);};
})();

---

这可能有用。修改了这个要点

（函数（）{
var lastTime=0；
var startTime=Date（）.getTime（）；
var供应商=['ms'，'moz'，'webkit'，'o']；
对于（var x=0；x

---

在第一次执行闭包时获取时间戳（页面加载），然后将当前时间戳和原始时间戳之间的差异传递到回调中。应该为您提供新方法的等效整数。没有那么精确，但比完全不同的值要好。

我也刚刚读过那篇文章，很想自己试试。在不支持高分辨率计时器的浏览器中，我尝试向rAF回调添加包装器。它使用Paul Irish的原始polyfill，并添加了以下行：

var hasPerformance = !!(window.performance && window.performance.now);

// Add new wrapper for browsers that don't have performance
if (!hasPerformance) {
    // Store reference to existing rAF and initial startTime
    var rAF = window.requestAnimationFrame,
        startTime = +new Date;

    // Override window rAF to include wrapped callback
    window.requestAnimationFrame = function (callback, element) {
        // Wrap the given callback to pass in performance timestamp
        var wrapped = function (timestamp) {
            // Get performance-style timestamp
            var performanceTimestamp = (timestamp < 1e12) 
                ? timestamp 
                : timestamp - startTime;

            return callback(performanceTimestamp);
        };

        // Call original rAF with wrapped callback
        rAF(wrapped, element);
    }        
}

var hasPerformance=！！（window.performance&&window.performance.now）；
//为没有性能的浏览器添加新包装器
如果（！hasPerformance）{
//存储对现有rAF和初始起始时间的引用
var rAF=window.requestAnimationFrame，
开始时间=+新日期；
//覆盖窗口rAF以包含包装回调
window.requestAnimationFrame=函数（回调，元素）{
//包装给定回调以传入性能时间戳
var wrapped=函数（时间戳）{
//获取性能样式时间戳
var performanceTimestamp=（时间戳<1e12）
？时间戳
：时间戳-开始时间；
返回回调（performanceTimestamp）；
};
//使用包装回调调用原始rAF
rAF（包裹的，元素）；
}        
}

以下是所有这些内容的要点，以及使用新代码更新的示例：

此方法旨在将传递到回调函数的参数规范化为高分辨率计时器格式。如果现有的代码期望使用高分辨率计时器，可以使用类似的方法（正好相反）将其转换为旧格式，但我认为这是一种回归

---

我将在我目前正在进行的一个项目中试用它，如果发现任何问题/改进，我将更新要点。

这是Paul Irish的博客，其中包含原始polyfil及其更新

---

对于大多数情况，这应该足够了。

如果没有新的APIsWe计划在Chrome 21中推出这一更改，我认为不可能让一个亚毫秒计时器工作，因此如果您已经利用了这个回调参数，请确保更新您的代码不是Chrome 20，你还有时间。虽然polyfills可以很好地工作，但如果我忽略参数，我会尽可能使用它，否则为什么要引入新参数？谢谢。不幸的是，我目前没有机会仔细测试，但这看起来不错！没有

窗口。请求帧

。这是一个

窗口。requestAnimationFrame

var hasPerformance = !!(window.performance && window.performance.now);

// Add new wrapper for browsers that don't have performance
if (!hasPerformance) {
    // Store reference to existing rAF and initial startTime
    var rAF = window.requestAnimationFrame,
        startTime = +new Date;

    // Override window rAF to include wrapped callback
    window.requestAnimationFrame = function (callback, element) {
        // Wrap the given callback to pass in performance timestamp
        var wrapped = function (timestamp) {
            // Get performance-style timestamp
            var performanceTimestamp = (timestamp < 1e12) 
                ? timestamp 
                : timestamp - startTime;

            return callback(performanceTimestamp);
        };

        // Call original rAF with wrapped callback
        rAF(wrapped, element);
    }        
}