javascript - 在 PerformanceTiming 中，AJAX 请求时间对流程模型的哪一部分有贡献？

Question

我正在使用 PerformanceTiming测量页面加载时间的接口(interface)。

我的几个页面有很长的“浏览器时间”(即 loadEventEnd - responseEnd)，我认为这可能是因为来自页面的 Ajax 请求。

我的问题是:Ajax 请求适合 PerformanceTiming 流程模型的什么位置？它在“处理” block 中吗？

如果是这样，衡量 Ajax 执行时间的最佳方法是什么？

Answer 1

我们目前正在解决这个问题。几年来，我们一直有使用 jQuery 的“文档就绪”计时器触发的 ajax 请求。从技术上讲，这不应该扩展 loadEventEnd。但是，可以肯定的是，他们确实推出了 loadEventEnd 触发。

现在，我们正在深入了解上一个版本将这些值移到 loadEventEnd 之外发生了什么。

要真正衡量这些 ajax 请求，您需要使用 IE10 或 - 最好 - 大于 28 的 chrome 版本。它们都包含 resourceTiming 接口(interface)。

对于页面上加载的每个资源，您可以访问类似于上述 navigationTiming 接口(interface)的指标。

从 chrome 的 javascript 控制台(在 Windows 上为 ctrl+shift+j)，输入:

window.performance.getEntries()

这将返回与您的页面关联的所有对象。要获取 ajax 请求，您需要 initatorType = xmlhttprequest。您可以通过以下方式找到所有这些事件:

for(var i=0; i<window.performance.getEntries().length;i++){  
    console.log(window.performance.getEntries()[i].initiatorType);
}