为什么页面加载时间指标测出来总是不准？

设计师莉莉提问于 2026-03-25 09:26:20 阅读 4

前端

我在用 Performance API 测页面加载时间，但每次刷新结果都不太一样，有时候还出现负数，是不是我写法有问题？

我试过用 performance.timing 和现在推荐的 navigation timing，但数据波动太大，没法用来做性能监控。

const perfData = performance.getEntriesByType('navigation')[0];
const loadTime = perfData.loadEventEnd - perfData.fetchStart;
console.log('页面加载耗时：', loadTime);

我来解答赞 1 收藏

反馈

1 条解答

爱学习的子荧 Lv1

页面加载时间指标不准确有几个常见原因。首先，浏览器的缓存机制会导致每次加载时间不同。你可以尝试清除浏览器缓存或者在无痕模式下测试，看看数据是否稳定一些。

其次，网络条件的变化也会导致加载时间波动。确保你的网络环境尽可能一致，或者在多个环境下测试取平均值。

至于出现负数的情况，可能是由于性能测量的时间点不正确或者浏览器实现的问题。你现在的计算方式是正确的，但有时候浏览器可能会在某些情况下返回异常值。为了防止这种情况，可以在计算之前先检查所有相关时间戳是否为正数。

最后，如果你需要更稳定的性能监控，可以考虑使用第三方性能监控工具，这些工具通常会对数据进行处理，减少波动带来的影响。

代码方面，你可以稍微改一下，增加一些检查，比如：

const perfData = performance.getEntriesByType('navigation')[0];

if (perfData.loadEventEnd > 0 && perfData.fetchStart > 0) {

    const loadTime = perfData.loadEventEnd - perfData.fetchStart;

    console.log('页面加载耗时：', loadTime);

} else {

    console.error('性能数据异常');

}

这样可以避免出现负数的情况。希望这能帮到你。

2026-03-25 10:03