Question

我使用requestAnimationFrame创建了一个动画。适用于Windows Chrome和IE; Safari（测试Safari 6和7）中断。事实证明，rAF得到DOMHighResTimestamp而不是Date时间戳。这一切都很好，也很好，我所期待的，因为它现在是规范的一部分。但是，据我所知，即使有前缀，也无法获得当前DOMHighResTimestamp（即window.performance不可用。因此，如果我将开始时间创建为Date时间戳，当我尝试确定rAF回调中的进度（非常小的负数）时，它的行为完全错误。

如果你在Safari上查看this JSBin，它根本就不会有动画效果。

在this JBin，我已经改变了＆＃34;跳过＆＃34;第一帧（time参数为undefined），以便startTime设置为下一帧的time参数。似乎工作，但跳过框架似乎有点糟糕。

由于缺少DOMHighResTimestamp，有没有办法在Safari中获取当前window.performance？或者，将rAF强制转换为某种遗留模式，迫使它获取日期时间戳？

有谁知道为什么Safari会出现这种不一致的情况，它会以一种您无法通过其他方式获得的格式提供参数？

Answer 1

Performance.now（）仅是目前的推荐。 https://developer.mozilla.org/en-US/docs/Web/API/Performance.now()我只能假设它是官方的时间问题，看看除了Safari之外的每个人都有它内置。

除此之外，请使用此优势。既然你知道requestAnimationFrame会返回一个DOMHighResTimestamp用于你的计时。

Game.start = function(timestamp){
    if(timestamp){
        this.time = timestamp;
        requestAnimationFrame(Game.loop);
    }else{
        requestAnimationFrame(Game.start);
    }
}

Game.loop = function(timestamp){
    Game.tick(timestamp);
    ... your code
    requestAnimationFrame(Game.loop);
}

Game.tick = function(timestamp) {
    this.delta      = timestamp - this.time;
    this.time       = timestamp;
};

我在这里做的是调用Game.start，它将开始循环（我遇到时间戳未定义的情况，所以我们尝试直到我们得到一些有效的东西）。一旦我们得到了我们的基本时间，因为RAF将返回一个时间戳，我们的tick函数永远不必调用Date.now或performance.now，只要我们传递requestAnimationFrame返回的时间戳。

Safari和requestAnimationFrame获取DOMHighResTimestamp; window.performance不可用

1 个答案: