首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >perfomance.now()在requestAnimationFrame - performance.now()之前调用有一个较大的t

perfomance.now()在requestAnimationFrame - performance.now()之前调用有一个较大的t
EN

Stack Overflow用户
提问于 2017-02-09 10:31:29
回答 1查看 478关注 0票数 4

所以我有一个简单的函数:

代码语言:javascript
复制
var start = function(){

    lastFrame = performance.now();


    requestAnimationFrame((t)=>{interval(t)});


}

和我的interval函数(只是为了测试目的,我阻塞了每个rAF邮票的值)

代码语言:javascript
复制
function interval(t){
    console.log (t);
    console.log(lastFrame);
}

现在我读了following response to another question,但我只是不明白这个人的答案的几个部分。

传递给requestAnimationFrame()回调的时间戳是动画帧开始的时间。在同一帧中调用的多个回调都会收到相同的时间戳。因此,如果()在参数值之前返回一段时间,这将是非常奇怪的,但在参数值之后返回时间并不奇怪。

“如果performance.now()返回参数值之前的时间,这将是非常奇怪的”?

这怎么会很奇怪?我以为Javascript是一种解释语言?在这一点上:

代码语言:javascript
复制
lastFrame = performance.now();

浏览器现在甚至没有提到下一行:

代码语言:javascript
复制
requestAnimationFrame((t)=>{interval(t)});

当然,如果您在为performance.now()提供回调之前调用了requestAnimationFrame,那么lastFrame的时间应该小于传递给requestAnimationFrame的t。

在这个人的回应中,他列出了一个涉及到请求动画帧的6步过程。但是,他将performance.now()调用作为列出了最后一步。

当浏览器在animationFrame请求之前对其进行解释时,这怎么可能是最后一步呢?

EN

回答 1

Stack Overflow用户

发布于 2017-04-29 05:40:19

我也碰到过这个。好像是个bug,因为它太不直观了。

我使用Date.now()作为elapsedTime的初始值。

代码语言:javascript
复制
var elapsedTime = 0;
var startTime = Date.now();
var lastTime = null;

requestAnimationFrame(update);

function update(currentTime) {
  if (lastTime) {
    elapsedTime += currentTime - lastTime;
  } else {
    elapsedTime = Date.now() - startTime;
  }

  // Compute the next value in the animation.
  var value = computeValue(elapsedTime);

  // Store the timestamp representing the animation frame.
  lastTime = currentTime;
}
票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/42134256

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档