首字节时间（TTFB）是衡量连接设置时间和网络服务器响应能力的基础指标。它有助于确定Web服务器响应请求的速度是否过慢。对于导航请求（即对HTML文档的请求），此指标的获取位于所有其他web-vitals性能指标之前，较低的TTFB通常表示更快的服务器响应速度和更好的用户体验。
什么是TTFB
TTFB（Time To First Byte）是一个用于衡量从请求资源到接收到响应的第一个字节之间的时间的指标。
TTFB是以下请求阶段的总和：
重定向时间
Service Worker启动时间（如果适用）
DNS查询
连接和TLS协商
请求，直到响应的第一个字节到达
缩短连接设置时间和后端延迟时间能有效降低TTFB。
TTFB得分参考值
由于TTFB在以用户为中心的指标（例如首次内容渲染 [FCP] 和最大内容渲染 [LCP]）之前，因此建议服务器迅速响应导航请求，以便75百分位数的用户获得在“良好”阈值范围内的 FCP。作为粗略的指导，大多数网站应力求TTFB不超过0.8秒，即小于0.8秒被视为优秀，大于1.8秒被视为糟糕的表现。
由于TTFB并非核心网页指标，因此网站不必严格达到“良好”TTFB阈值，只要TTFB不会对网站在其他重要指标上的理想评分产生负面影响。
网站在加载页面的方式上存在显著差异。较低的TTFB对于迅速将HTML内容传送至客户端至关重要。如果网站能够快速传送初始HTML，但随后需要通过JavaScript来填充有意义的内容（如单页应用 [SPA] 的情形），则实现尽可能低的TTFB显得尤为重要，以便更快地在客户端渲染页面。相对而言，采用服务器端渲染的网站在客户端的工作量较少，尽管其TTFB可能较高，但FCP和LCP表现较佳。因此，TTFB的阈值仅为“粗略的指导”，在评估时需结合网站核心内容的加载方式进行综合考量。
如何测量TTFB
在JavaScript中，我们使用Navigation Timing API来获取TTFB。以下示例展示了如何创建一个监听navigation条目并将其记录到控制台的PerformanceObserver：
new PerformanceObserver((entryList) => {
const [pageNav] = entryList.getEntriesByType('navigation');
console.log(`TTFB: ${pageNav.responseStart}`);
}).observe({
type: 'navigation',
buffered: true
});