javascript - 请求动画帧 : what exactly is the timestamp?

标签 javascript

我一直认为requestAnimationFrame使用的时间戳和JavaScript中常用的时间戳是一样的,就是从1970年1月1日开始的毫秒数,今天抓取时间戳验证了一下,发现RAF时间戳大概是从1970年1月1日开始算起的页面加载的开始。时间戳的精确测量依据是什么?

测试代码:

<p id="output"></p>

var i = 0;
var start = null;
var times = [];
var dur = 5000;

function step(timestamp) {
 if (start===null) start = timestamp;
 times[i++] = timestamp;
 if (timestamp-start<=dur) {
  requestAnimationFrame(step);
 } else {
  document.getElementById('output').innerHTML = times.join('<br>');
 }
}

requestAnimationFrame(step);

给出这样的结果:

158.52126457412882
183.12243595205535
199.52116819316421
...

在所有支持 RAF 的浏览器中。

最佳答案

这是一个 DOMHighResTimeStamp 或高分辨率时间戳(与 window.performance.now() 相同)。

时间戳是:

current time for when requestAnimationFrame starts to fire callbacks.

普通时间戳和高分辨率时间戳的主要区别在于:

DOMTimeStamp only has millisecond precision, but DOMHighResTimeStamp has a minimal precision of ten microseconds.

注意:一些浏览器还没有实现 rAF 的这个方面,可能会给你错误的或没有值(value)的参数。

一些资源:

关于javascript - 请求动画帧 : what exactly is the timestamp?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21316084/

相关文章:

javascript - 引导标签输入 : Can't add objects when itemValue option is not set

javascript - 监听 PanResponder 来改变状态值

javascript - 在 Typescript 中输入可选的可调用装饰器

javascript - 如何正确过滤数组

Javascript RegEx - 仅当以特定短语结尾时才选择字符前面的所有内容

javascript - jquery tablesorter 波斯语/波斯语排序表问题

javascript - 无法将图像添加到结构 js 组

javascript - 单击div时,检查相应的radio输入jquery

javascript - 映射对象数组并根据名字进行过滤

javascript - 使用 jQuery 流畅地制作动画