此页面由 Cloud Translation API 翻译。

Switch to English

网页指标

Philip Walton

Twitter GitHub 首页

针对用户体验质量进行优化是网络上任何网站取得长期成功的关键。无论您是企业主、营销者还是开发者，Web Vitals 都可以帮助您量化网站体验，并发现改进机会。

概览

“网页指标”是 Google 推出的一项计划，旨在针对对提供出色 Web 体验至关重要的质量信号提供统一指南。

多年来，Google 提供了许多工具来衡量性能并生成相关报告。有些开发者是这些工具的使用专家，而有些开发者发现丰富的工具和指标很难跟上。

网站所有者不必是性能专家，就能了解其向用户提供的体验的质量。“网页指标”计划旨在简化这一过程，并帮助网站专注于最重要的指标，即核心网页指标。

核心网页指标

核心网页指标是应用于所有网页的一部分网页指标，应该由所有网站所有者进行衡量，并且会出现在所有 Google 工具中。每个核心网页指标都代表用户体验的一个独特方面，可在实际应用中衡量，并反映以用户为中心的关键结果的真实体验。

构成核心网页指标的指标会随着时间的推移而不断改进。2020 年的现状侧重于用户体验的三个方面（加载、互动和视觉稳定性），并包含以下指标（及其各自的阈值）：

Largest Contentful Paint (LCP)：衡量加载性能。为了提供良好的用户体验，LCP 应在网页首次开始加载后的 2.5 秒内发生。
First Input Delay (FID)：衡量互动。为了提供良好的用户体验，页面的 FID 应不超过 100 毫秒。
Cumulative Layout Shift (CLS)：衡量视觉稳定性。为了提供良好的用户体验，页面应保持 0.1 或更低的 CLS。

对于上述每个指标，为了确保您达到大多数用户的推荐目标，可以衡量网页加载的第 75 个百分位（按移动设备和桌面设备细分）。

如果网页在上述三个指标的第 75 百分位达到建议的目标，则评估核心网页指标合规性的工具应考虑网页通过测试。

生命周期

“核心网页指标”轨道上的指标会经历一个生命周期，由三个阶段组成：实验性、待处理和稳定版。

下表反映了所有核心网页指标目前所处的生命周期阶段：

实验性功能	待处理	稳定版
	INP	LCP CLS FID

每个阶段都旨在告知开发者应如何看待各项指标：

实验性指标是指未来的核心网页指标，它们可能仍在进行重大更改，具体取决于测试和社区反馈。
待定指标是指已通过测试和反馈阶段的未来核心网页指标，并且具有明确明确的稳定时间表。
稳定的指标是当前一组核心网页指标，Chrome 认为这些指标对于打造出色的用户体验至关重要。

实验性

当指标最初开发并进入生态系统时，就会被视为实验性指标。

实验阶段的目的是评估指标的适用性，首先探索要解决的问题，并可能对先前的指标可能无法解决的问题进行反复改进。例如，Interaction to Next Paint (INP) 最初只是作为一项实验性指标开发的，旨在比 First Input Delay (FID) 更全面地解决 Web 上存在的运行时性能问题。

核心网页指标生命周期的实验阶段还旨在通过发现 bug 甚至探索对初始定义的更改，为指标的开发提供灵活性。这也是一个阶段，社区反馈是最重要的阶段。

等待中

当 Chrome 团队确定某个实验性指标已收到足够的反馈并证明其有效性后，就会成为待处理的指标。待处理指标在此阶段保留至少六个月，以便让生态系统有时间进行调整。如果指标要推进到待处理阶段，唯一需要阻碍的就是等待过渡期。随着越来越多的开发者开始使用该指标，社区反馈仍然是此阶段的一个重要方面。

稳定

核心网页指标候选指标最终确定后，便会成为稳定的指标。对于核心网页指标跟踪中的指标，这意味着该指标会成为核心网页指标。

稳定指标已获得积极支持，可能会进行 bug 修复和定义更改。稳定的核心网页指标每年不会超过一次。对核心网页指标的任何更改都将在指标的官方文档以及指标的 CHANGELOG 中明确传达。核心网页指标也会纳入所有评估中。

衡量和报告核心网页指标的工具

Google 认为，核心网页指标对所有网络体验都至关重要。因此，该公司致力于在其所有常用工具中显示这些指标。以下各部分详细介绍了哪些工具支持核心网页指标。

衡量核心网页指标的实战工具

Chrome 用户体验报告会针对每个核心网页指标收集经过匿名处理的真实用户衡量数据。借助这些数据，网站所有者可以快速评估网站性能，而无需手动对其网页进行插桩分析，还可为 PageSpeed Insights 和 Search Console 的“核心网页指标”报告等工具提供支持。

	LCP	FID	CLS
Chrome 用户体验报告	✔	✔	✔
PageSpeed Insights	✔	✔	✔
Search Console（“核心网页指标”报告）	✔	✔	✔

Chrome 用户体验报告提供的数据可让您快速评估网站的性能，但并未提供准确诊断、监控回归问题和快速响应回归所需的详细每网页浏览遥测数据。因此，我们强烈建议网站设置自己的真实用户监控功能。

使用 JavaScript 衡量核心网页指标

每个核心网页指标都可以使用标准 Web API 以 JavaScript 的形式进行衡量。

若要衡量所有核心网页指标，最简单的方法是使用 web-vitals JavaScript 库，这是一种可用于生产环境的小型底层 Web API 封装容器，用于衡量每项指标，以便与上述所有 Google 工具的报告方式完全一致。

借助 web-vitals 库，测量每个指标就像调用单个函数一样简单（如需了解完整的用法和 API 详细信息，请参阅文档）：

import {onCLS, onFID, onLCP} from 'web-vitals';

function sendToAnalytics(metric) {
  const body = JSON.stringify(metric);
  // Use `navigator.sendBeacon()` if available, falling back to `fetch()`.
  (navigator.sendBeacon && navigator.sendBeacon('/analytics', body)) ||
    fetch('/analytics', {body, method: 'POST', keepalive: true});
}

onCLS(sendToAnalytics);
onFID(sendToAnalytics);
onLCP(sendToAnalytics);

将网站配置为使用 web-vitals 库衡量核心网页指标数据并将其发送到分析端点后，下一步是汇总并报告这些数据，以查看您的网页至少有 75% 的网页访问是否达到建议的阈值。

虽然一些分析服务提供商已经内置了对核心网页指标指标的支持，即便那些不应该包含基本的自定义指标功能，也允许您在其工具中衡量核心网页指标。

例如“网页指标”报告，网站所有者可以使用 Google Analytics（分析）衡量其核心网页指标。如需了解如何使用其他分析工具衡量核心网页指标，请参阅衡量实际网页指标的最佳实践。

您还可以使用 Web Vitals Chrome 扩展程序，针对每个核心网页指标生成报告，而无需编写任何代码。此扩展程序使用 web-vitals 库来测量上述每个指标，并在用户浏览网页时向其显示这些指标。

此扩展程序有助于您了解自己网站、竞争对手网站以及整个网络的效果。

	LCP	FID	CLS
web-vitals	✔	✔	✔
网页指标扩展程序	✔	✔	✔

或者，如果开发者更喜欢通过底层 Web API 直接衡量这些指标，可以参阅下列指标指南，了解实现详情：

用于衡量核心网页指标的实验室工具

虽然所有核心网页指标首先都是实测指标，但许多指标在实验室中也是可以衡量的。

实验室测量是在开发期间（在向用户发布功能之前）测试其性能的最佳方法。这也是在性能下降之前防止性能下降的最佳方式。

以下工具可用于在实验室环境中衡量核心网页指标：

	LCP	FID	CLS
Chrome 开发者工具	✔	✘（请改用 TBT）	✔
Lighthouse	✔	✘（请改用 TBT）	✔

虽然实验室测量是提供出色体验的重要部分，但它不能替代现场测量。

根据用户的设备功能、用户的网络条件、设备上运行的其他进程以及用户与网页互动的方式，网站的性能可能会有很大差异。实际上，每个核心网页指标的得分都会受到用户互动的影响。只有实地测量才能准确反映全面情况。

提高分数的建议

衡量核心网页指标并确定需要改进的方面后，下一步就是优化。以下指南针对如何针对每个核心网页指标优化网页提供了具体建议：

其他网页指标

虽然核心网页指标是了解和提供出色用户体验的关键指标，但除此之外，还有一些其他重要指标。

这些其他网页指标通常用作核心网页指标的代理或补充指标，有助于获取更广泛的体验，或帮助诊断特定问题。

例如，“首次内容渲染时间 (TTFB)”和“First Contentful Paint (FCP)”指标都是加载体验的重要方面，都有助于诊断 LCP 问题（服务器响应时间过长或阻塞渲染的资源）。

同样，Total Blocking Time (TBT) 和可交互时间 (TTI) 等指标是实验室指标，它们对于捕获和诊断将影响 FID 的潜在互动问题至关重要。不过，它们不属于“核心网页指标”集合的一部分，因为它们无法现场衡量，也不反映以用户为中心的结果。

不断演变的网页指标

“网页指标”和“核心网页指标”是开发者目前可用于衡量网站体验质量的最佳信号，但这些信号还不够完美，预计未来会有改进或补充。

核心网页指标与所有网页相关，并且会在相关 Google 工具中显示。对这些指标的更改将产生广泛的影响；因此，开发者应该预料到核心 Web 指标的定义和阈值保持稳定，更新会提前发出通知，并具有可预测的年度更新频率。

其他网页指标通常因上下文或工具而异，可能比核心网页指标更具实验性。因此，它们的定义和阈值可能会随着频率的变化而变化。

对于所有网页指标，更改都将明确记录在此公开的 CHANGELOG 中。