TTFB 是一个衡量对资源的请求和响应的第一个字节开始和到达之间时间的指标。
TTFB 是下列请求节点的时间损耗汇总：
- Redirect time 重定向时延
- Service worker 启动时延（如果适用）
- DNS 查询时延
- 建立连接和 TLS 所消耗时延
- 请求，直到响应的第一个字节到达为止的时延
减少连接建立和后端服务的时延将有助于降低 TTFB
作为一个粗略的指导，大多数网站应努力使 TTFB 少于 0.8 秒 。
如何优化
优化 TTFB 在很大程度上取决于您的托管供应商和后端服务。TTFB 值高可能是由于以下一个或多个问题造成的。
- 托管服务商的基础设施能力不足，无法处理高流量负载
- 网络服务器的内存不足，可能导致 系统颠簸
- 未经优化的数据库
- 不良的数据库服务器配置
总结：选择一个合适的供应商与CDN结合
一个优化案例
这个案例中他主要是因为使用的两个中间件函数：
- 一个用于从我的时事通讯提供商获取数据以获取最新的订阅者数量
- 另一个用于从 Twitch API 获取数据以显示我的最新流视频，或当前正在进行的直播中的最新缩略图。这两个函数都会在内存中获取初始 HTTP 响应，从第三方 API 获取一些数据，并相应地重写 HTML。
优化方案
- 删除获取时事通讯订阅者数量的 Edge 函数，而是在构建时获取数据并静态生成数据。在我进行重建之前，该数字不会是最新的，但我们可以通过在数字中添加加号来解释小的不准确之处，或者如果 API 调用在构建时出错，则返回一个字符串来近似数字。
- 从服务器获取的 Twitch 数据移动到客户端 Web Worker，以避免在主线程上引入新的渲染阻塞行为。然而，虽然TTFB确实有所下降，但累积布局偏移（CLS）成为一个问题。
- 现在不再在请求时从 Twitch API 获取数据以获取最新的直播信息，而是使用嵌入的 Twitch 视频播放器来显示当前的直播。这样做的缺点是页面会加载一些额外的客户端 JavaScript 来显示播放器。