计算和验证首字节时间 (TTFB)

Question

我得到了以下公式来测量首字节时间 (TTFB)、TTFB 到 DOM 就绪和页面加载。

TTFB

window.performance.timing.responseStart - window.performance.timing.navigationStart

TTFB 到 DOM 就绪

window.performance.timing.domComplete - window.performance.timing.navigationStart

页面加载

window.performance.timing.loadEventStart - window.performance.timing.navigationStart

这些公式正确吗？我怎样才能检查它们？我听说您可以在 Firebug 的 Network 面板中测量它们，但在检索这些值时似乎总体上很麻烦。不确定您在 Chrome 中从哪里获得这些值。

那么，如何确定这些测量值？

Answer 1

Firebug 实际上使查看这些时间变得非常容易。您只需要在其命令行中执行window.performance.timing，它就会显示一个图表并列出下面的所有时间，如下所示：

另外，根据description on MDN，我认为您的计算应该从fetchStart 开始，因为那是浏览器准备好使用HTTP 请求获取文档的时刻。根据您对 DOM Ready 的定义，该测量的结束时间也可能是 domInteractive 或 domContentLoadedEventStart 时间。

所以，我想说正确的测量是：

TTFB

window.performance.timing.responseStart - window.performance.timing.fetchStart

TTFB 到 DOM 就绪

window.performance.timing.domInteractive - window.performance.timing.fetchStart

页面加载

window.performance.timing.loadEventStart - window.performance.timing.fetchStart

Answer 2

这可以使用 Chrome 的网络标签来确认：

TTFB 示例：

window.performance.timing.responseStart - window.performance.timing.requestStart