PageSpeed Insights 添加了新的 Lighthouse 速度指标

Google 的 PageSpeed Insights 为 PageSpeed Insights API 和 Lighthouse 的 UI 添加了两个新指标。 这两个标记为实验性的指标现在正在收集用于现场数据，而相应的实验室数据可用于诊断目的。

谷歌灯塔更新

Lighthouse 现在更新了两个新指标。

新的 Lighthouse 指标是：

• 与下一次油漆的交互 (INP)
• 到第一个字节的时间 (TTFB)

到第一个字节的时间 (TTFB)

许多人已经知道 Time to First Byte，它已经存在很多年了，有些人可能已经熟悉它。

Time to First Byte (TTFB) 度量标准衡量服务器响应资源请求的速度。

因此，该指标的重要性在于它有助于隔离一个因素（服务器响应能力），该因素可能对随后出现的所有其他页面加载指标产生负面影响。

这使得 TTFB 成为用于诊断目的的非常重要的审查指标。

任何专注于改进 Core Web Vitals 的人都应该给 TTFB 一个可能的快速获胜机会。

TTFB 的变化在于，这是第一次在 PageSpeed Insights 结果部分中将其作为指标提供。

Chrome 也将首次收集和报告 TTFB 现场数据。

与下一次油漆的交互 (INP)

Interaction to Next Paint (INP) 是一个全新的指标，表示与整个页面交互所需的时间，谷歌称之为“整体交互延迟”。

INP 度量表示与整个页面交互所需的时间，这与 First Input Delay 形成对比，后者仅测量页面响应站点访问者的第一次交互所需的时间。

谷歌使用一个购物页面的例子来说明一个好的 INP 和一个差的 INP 之间的区别。

购物页面的示例显示了一个可点击的图像，该图像产生了一个更大的特写版本。

响应不佳的示例是用户单击图像，然后等待更大的图像下载到浏览器时发生某些事情。 没有对点击的反馈响应。

良好响应的示例是用户单击同一图像，该图像立即响应页面加载图形，该图形表明已收到对图像的请求并且现在正在加载。

网页元素响应良​​好的屏幕截图

以上是新 INP 指标如何测量网页的所有响应元素以表示与 Next Paint 的交互的示例。

Google 的 Web.dev 解释了新的“与下一次绘制 (INP) 交互”指标：

“INP 是一种指标，旨在通过选择用户访问页面时发生的最长交互之一来表示页面的整体交互延迟。

对于总共少于 50 次交互的页面，INP 是延迟最差的交互。

对于有很多交互的页面，INP 通常是交互延迟的 98%。”

新的 PageSpeed Insights 布局

这两个新指标现在可以在 PageSpeed Insights 工具中查看。

但是字段数据可能需要一些时间才能显示出来，因为字段数据来自实际的 Chrome 浏览器用户，这些用户选择允许将页面速度数据发送给 Google 以访问该站点并记录他们的数据。

核心网络生命体征得分连续列出（在桌面视图中）。

Lighthouse 然后显示第二行指标：

• 第一次内容丰富​​的油漆
• 输入法
• TTFB

新 Lighthouse Metrics 显示的屏幕截图

Chrome 灯塔扩展

查看新指标的另一种方法是使用 Chrome Lighthouse 扩展程序。

使用它的方法是浏览到任何页面，浏览器右上角的方框将根据页面是否通过 Core Web Vitals 指标变为红色或绿色。

单击框本身会激活 CWV 和实验指标的显示。

Chrome 灯塔扩展截图

3rd 方工具中可用的新指标

许多在分析中使用 Lighthouse 的页面速度工具也会显示 INP 和 TTFB 指标。

例如，WebPageTest.org 现在显示新指标。

WebPageTest Lighthouse 结果截图

Page Speed Insights 更新

PageSpeed Insights 工具还有其他更新。

一个显着的变化是显示结果的速度，这是通过同时加载现场和实验室数据来实现的。

另一个变化是 PageSpeed Insights 将首先尝试解析 HTTP 重定向，然后再将其发送到 Lighthouse 进行分析。 以前 Lighthouse 会在执行分析时处理 HTTP 重定向。

加上另外两个额外的变化：

“Core Web Vitals (CWV) 指标（LCP、FID、CLS）直接显示在 CWV 评估下方。

我们收紧了设计，减少了冗长和垂直空间。”

灯塔数据更有用

TTFB 和 INP 这两个指标的添加使所有使用 Lighthouse 分析的页面速度工具变得更加有用。 TTFB 提供有关服务器相关问题的反馈，这些问题可能是其他地方速度性能不佳的原因，而 INP 提供了比以前更广泛的页面性能概述。

引文

阅读 Google 的官方 INP 解释器

与下一次油漆的交互 (INP)

阅读谷歌最近更新的 TTFB 解释器

到第一个字节的时间 (TTFB)

阅读 PageSpeed Insights 发行说明

PageSpeed Insights API 和 PageSpeed Insights UI 的发行说明