javascript - Chrome-devtools时间轴中的事件时间与性能计时API之间的时差

我试图在控制台中获取例如loadEventEnd时间。您可以通过performance timing 2 API或performance timing API来实现。
通过执行以下计算，我得到相同的结果:

performance.getEntriesByType("navigation")[0].loadEventEnd
// 483.915
chrome.loadTimes().finishLoadTime * 1000 - chrome.loadTimes().startLoadTime * 1000
// 484
performance.timing.loadEventEnd - performance.timing.navigationStart
// 484

但是在devtools的“时间轴”选项卡中，我得到结果 510 ms 。
差异显示在这张照片中:



在其他站点上会发生此问题:在控制台中，我得到的时间总是比在“时间轴”选项卡中的时间短。
有人可以解释这种差异吗？
哪一次是真实的？

最佳答案

正如@Dragomok在评论中建议的那样:
navigation-timing-api在navigationStart事件上开始记录。 “性能”选项卡时间轴在navigationStart事件之前开始记录“某个时间”，这就是为什么performance.getEntriesByType("navigation")[0].loadEventEnd在时间轴中提供的值小于loadEventEnd的原因。

如果您计算时间轴loadEventEnd - navigationStart，则将获得与oj​​it_code中相同的值。

这是图片证明:

关于javascript - Chrome-devtools时间轴中的事件时间与性能计时API之间的时差，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/43710347/