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

Question

我正在使用PerformanceTiming接口来测量页面加载时间。

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

我的问题是：Ajax 请求在哪里适合 PerformanceTiming 流程模型？它在“处理”块中吗？

过程模型

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

score 2 · Accepted Answer

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

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

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

对于页面上加载的每个资源，您可以访问类似于上面的 navigationTiming 界面的指标。

从 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);
}

score 0 · Accepted Answer

Ajax 请求在模型结束之后。

请参阅https://stackoverflow.com/a/16289733/1168884以了解 Ajax 请求运行且不影响性能对象上的属性（仅反映页面的加载）的示例

我想根本的问题是，页面加载事件是完全定义的（例如，DOM 现在是完整且可用的），这反映在模型中。Ajax 事件不是（例如，当您可以说“页面上的所有 Ajax 现已完成运行”时，实际上并没有发生事件）。

我还没有尝试过，但是有一个项目 Boomerang 承诺允许测量动态加载的内容 - http://lognormal.github.io/boomerang/doc/use-cases.html

2 回答 2