具有动态内容的HTML5 Navigation Timing API

Question

我想知道动态内容是否对loadEnd等时序值有任何影响。例如，我在加载页面后使用jquery有条件地更改代码中图像的'src'属性。这是怎么处理的？我尝试通过检查加载图像之前和之后的值来测试它，看起来加载此图像后值不会改变。 这是否意味着导航计时API不包含动态内容加载？

Answer 1

loadEventEnd NavigationTiming属性的值在文档的load事件触发后返回：

  

loadEventEnd属性

     

此属性必须返回当前文档的加载事件完成时的时间。当load事件未触发或未完成时，它必须返回零。

来自你的陈述：

  

...我有条件地使用jquery在我的代码中更改图像的'src'属性，在加载页面后 ...

听起来您正在更新主体src事件期间或之后的load属性。由于load事件仅在页面上触发一次，因此window.performance.timing.loadEventEnd属性在设置为非零值后永远不会更改。因此，它不会反映下载新img src所花费的额外时间。

如果您希望包含下载正在更改src的其他图片所需的时间，则可以挂钩该图片的load事件。一旦该事件触发，请将Date.now()与navigationStart进行比较，而不是loadEventEnd，以获得已用完的页面加载时间。