domInteractive 与 Time to Interactive - 有什么区别?

domInteractive vs Time to Interactive - whats the difference?

Google 提供了许多 polyfill 库,用于测量和跟踪分析平台上的首次输入延迟 (FID) 和交互时间 (TTI)。然而,这个指标并不是 GA 的标准。

domInteractive 但是,您可以使用 GA 开箱即用地跟踪指标。

有什么区别?我找到的关于竞争性交互指标的唯一解释是一个模糊的论坛 post 解释说 TTI 可能提供更复杂的交互延迟观察,但没有太多细节。

如果我担心输入延迟会影响转换,那么我最好还是跟踪我的用户的 TTI,还是我可以坚持使用 domInteractive?

根据 this link,domInteractive 是 "when the parser finished its work on the main document"。交互时间 - 所有页面脚本(包括库,例如 Angular 和您的脚本)完成初始化、页面未冻结并且用户可以开始与其交互的时间。

我的理解是这样的:

交互时间 (TTI) 是指网站视觉上可用且引人入胜。例如,当用户可以点击 UI 并且网站正常运行时。理想情况下,我们希望所有体验都尽快 具有交互性 。 TTI 较差的网站示例是用户可以在实际发生任何事情之前与 UI 积极互动很长一段时间的网站。糟糕的 TTI 是由于 太多(主线程)JavaScript 造成的,这不利地导致可见 UI 元素的交互延迟。例如 here。这是移动 space 需要考虑的一个 特别重要的指标,因为每个人都没有一个很好的 phone (因此 需要更长的时间解析加载站点所需的 JavaScript) 以及由于 不同网络速度 而发生的差异:即 WI-FI、3G、4G

domInteractive 然而,当 页面的主要内容可见时 并且 有意义的绘制已经发生 .在此阶段,用户可以直观地看到网页和代表站点 DOM.

的相应 UI 元素

首次输入延迟 (FID) 是衡量响应用户事件所花的时间。例如,如何一旦用户单击按钮,按钮的事件处理程序接管并响应需要很长时间。

据我所知,FID 和 TTI 目前是实验性指标,因此它们可能不会被默认纳入 Google 分析。至于你的问题:"Am I better off tracking TTI on my users if I'm concerned about input delays affecting conversion, or am I fine to stick with domInteractive?" 如果你担心输入延迟影响转换,你实际上想要 track FID。 TTI 仍然是一个非常有用的跟踪指标,因为它衡量您的网站何时作为一个整体进行交互,并且 TTI 和 FID 将提供比 domInteractive 更多的价值。

如果您仍然感兴趣,请查看 Addy Osmani 在 Cost of JavaScript 上的解释。他很好地解释了我们面临的性能问题 JavaScript 以及 TTI 和 FID。

干杯

不得不深入 Spec 但我想我找到了我要找的东西:

DOMContentLoaded 事件在过渡到 "interactive" 之后但在过渡到 "complete" 之前触发,此时除了异步脚本元素之外的所有子资源都已加载。

基本上 domInteractive 不会 反映仍在加载的异步脚本,这就是为什么您的 TTI 指标可能变化如此之大。