javascript - 如何测量 JavaScript 中交互和 mousedown 事件之间的延迟？

Question

有没有办法测量按下鼠标按钮时和定义的 onmousedown 函数触发时之间的延迟？

或者，是否有关于此延迟的最新统计数据？

我假设这两个事件不是同时发生的，并且因浏览器而异。

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

我正在开发对时间敏感(毫秒)的音频应用程序。

任何帮助都很棒，谢谢!

Answer 1

您可能正在寻找 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 并不是单击鼠标的实际硬件时刻，而是浏览器从操作系统接收到单击事件的时间。然而，这总是发生在调用事件处理程序之前，并且延迟应该可以忽略不计。

关于链接的 fiddle ，对我来说，大多数时间的时间差异都在 1 毫秒以下；我偶尔会通过无情的按钮粉碎和页面重新加载来达到 10 毫秒以上的值，但这并不常见。当然，如果您在事件处理程序中执行更多计算密集型任务，则差异很容易攀升，在这种情况下，延迟补偿很快就会成为重要组成部分。