如何衡量JavaScript中交互和mousedown事件之间的延迟?

时间:2015-02-23 18:09:50

标签: javascript timing latency onmousedown

有没有办法测量当我按下鼠标按钮当定义的onmousedown函数触发时的延迟?

或者,目前有关于此延迟的统计数据吗?

我认为这两个事件不是同时发生的,因浏览器而异。

到目前为止,我唯一的方法是使用Date创建多个onmousedown事件并测量它们之间的时差。我发现它们之间有6毫秒的差异。

我正在研究时间敏感的音频应用程序(毫秒级)。

任何帮助都很棒,谢谢!

1 个答案:

答案 0 :(得分:3)

您可能正在寻找Event.timeStamp与当前时间戳Date.now()之间的差异。它们都以毫秒为单位返回自纪元以来经过的时间:

<强>的JavaScript

document.getElementById("mydiv").addEventListener('click', function (e) {
    // in milliseconds
    var latency = Date.now() - e.timeStamp;
});

Working example on JSFiddle.

通过从后者中减去前者 - ,如您在附带的代码段中所看到的那样 - 您可以测量延迟。

不幸的是,事件timeStamp不是点击鼠标的实际硬件时刻,而是当浏览器从您的操作系统接收点击事件时。但是,总是在调用事件处理程序之前发生,并且应该具有可忽略的延迟。

关于联系小提琴,我的时间差异大部分时间都在1ms以下;我偶尔设法通过无情按钮粉碎和页面重新加载达到10ms以上的值,但这并不常见。当然,如果你在事件处理程序中执行更多计算密集型任务,差异很容易就会升级,在这种情况下,延迟补偿很快就会成为必不可少的部分。