发布时间：2020 年 5 月 4 日
优化用户体验质量是网络中所有网站要长期取得理想成效的关键。无论您是企业主、营销者还是开发者，网页指标都可以帮助您量化网站的用户体验，并发现提升的机会。
概览
“网页指标”是 Google 推出的一项计划，旨在针对对于提供出色的网页用户体验至关重要的质量信号提供统一指导。
多年来，Google 提供了许多用于衡量和报告效果的工具。有些开发者擅长使用这些工具，而有些开发者则发现，由于工具和指标众多，很难跟上节奏。
网站所有者不必是效果专家，也能了解自己为用户提供的体验质量。Web Vitals 计划旨在简化环境，帮助网站专注于最重要的指标，即 Core Web Vitals。
核心网页指标
核心网页指标是适用于所有网页的一部分网页指标，所有网站所有者都应衡量这些指标，并且这些指标将显示在所有 Google 工具中。核心网页指标中的每个指标分别代表着用户体验的不同方面，可在实际环境中衡量，并反映了以用户为中心的关键结果的真实体验。
构成 Core Web Vitals 的指标会随着时间的推移而演变。当前这组指标侧重于用户体验的三个方面：加载速度、互动性和视觉稳定性，其中包括以下指标（及其各自的阈值）：
- Largest Contentful Paint (LCP)：衡量加载性能。为了提供良好的用户体验，应在网页首次开始加载的 2.5 秒内完成 LCP。
- Interaction to Next Paint (INP)：衡量互动性。为了提供良好的用户体验，网页的 INP 应不超过 200 毫秒。
- Cumulative Layout Shift (CLS)：衡量视觉稳定性。为了提供良好的用户体验，网页的 CLS 应保持为 0.1. 或更低。
为确保大多数用户都能达到这些指标的建议目标值，一个合适的衡量阈值是网页加载时间的第 75 个百分位数，并按移动设备和桌面设备进行细分。
如果网页在所有三个 Core Web Vitals 指标的第 75 百分位处达到建议的目标，则评估 Core Web Vitals 合规性的工具应将其视为通过测试。
Lifecycle
核心 Web 指标轨道上的指标会经历一个生命周期，该生命周期包括三个阶段：实验阶段、待处理阶段和稳定阶段。
每个阶段旨在向开发者表明他们应如何看待每个指标：
- 实验性指标是指潜在的 Core Web Vitals，可能仍会根据测试结果和社区反馈发生重大变化。
- 待处理指标是指未来的核心网页指标，这些指标已通过测试和反馈阶段，并且有明确的时间表来实现稳定状态。
- 稳定指标是指 Chrome 认为对提供出色用户体验至关重要的当前核心 Web 指标。
Core Web Vitals 分为以下生命周期阶段：
实验性
指标在最初开发并进入生态系统时，被视为实验性指标。
实验阶段旨在评估指标的适用性，首先要探索要解决的问题，并可能迭代之前的指标可能未能解决的问题。例如，Interaction to Next Paint (INP) 最初只是作为一项实验性指标开发的，旨在比 First Input Delay (FID) 更全面地解决网络上的运行时性能问题。
Core Web Vitals 生命周期的实验阶段还旨在通过发现 bug 甚至探索其初始定义的更改，为指标的开发提供灵活性。这也是社区反馈最为重要的阶段。
待处理
当 Chrome 团队确定某个实验性指标已收到足够的反馈并证明其有效性后，就会成为待处理指标。例如，INP 已于 2023 年从实验性阶段提升为待处理状态，旨在最终弃用 FID。
待处理指标在此阶段至少会保留 6 个月，以便生态系统有时间进行调整。随着越来越多的开发者开始使用该指标，社区反馈仍是该阶段的重要方面。
稳定
当 Core Web Vitals 候选指标最终确定后，它就会成为稳定指标。此时，该指标便可成为 Core Web Vitals 指标。
稳定指标得到了积极支持，可能会发生问题修复和定义更改。稳定的 Core Web Vitals 指标每年最多更改一次。我们会在指标的官方文档和更新日志中明确说明对 Core Web Vitals 指标所做的任何更改。所有评估中也都会包含核心网页指标。
用于衡量和报告 Core Web Vitals 的工具
Google 认为核心网页指标对所有网页体验都至关重要。因此，它致力于在其所有热门工具中显示这些指标。下面几部分详细介绍了哪些工具支持 Core Web Vitals。
用于衡量核心 Web 指标的现场工具
Chrome 用户体验报告会为每个 Core Web Vital 收集经过匿名处理的真实用户衡量数据。借助这些数据，网站所有者无需在网页上手动插桩分析，即可快速评估其性能，这些数据还为 Chrome DevTools、PageSpeed Insights 和 Search Console 的 Core Web Vitals 报告等工具提供支持。
Chrome 用户体验报告提供的数据可帮助您快速评估网站性能，但它无法提供每次网页浏览的详细遥测数据，而这通常是准确诊断、监控性能下降问题以及快速应对性能下降所必不可少的。因此，我们强烈建议网站设置自己的真实用户监控。
使用 JavaScript 衡量核心网页指标
您可以使用标准 Web API 在 JavaScript 中衡量每个 Core Web Vitals。
衡量所有核心网页指标的最简单方法是使用 web-vitals JavaScript 库。该库是围绕底层 Web API 的一种小型、可用于生产环境的封装容器，可以与前面列出的所有 Google 工具报告的方式准确衡量每个指标。
借助 web-vitals 库，只需调用一个函数即可衡量每个指标。如需了解完整的用量和 API 详情，请参阅文档。
import {onCLS, onINP, 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);
onINP(sendToAnalytics);
onLCP(sendToAnalytics);
将您的网站配置为使用 web-vitals 库衡量 Core Web Vitals 数据并将其发送到分析端点后，下一步是汇总这些数据并生成报告，以了解您的网页是否在至少 75% 的网页访问中达到建议的阈值。
虽然某些分析服务提供商内置了对 Core Web Vitals 指标的支持，但即使那些提供商不应包含基本自定义指标功能（让您能够在其工具中衡量 Core Web Vitals 指标），也是如此。
如果开发者更倾向于直接使用底层 Web API 衡量这些指标，则可以改为使用以下指标指南了解实现详情：
如需有关使用热门分析服务或您自己的内部分析工具衡量这些指标的更多指导，请参阅衡量实际网页指标的最佳实践。
衡量 Core Web Vitals 的实验室工具
虽然所有 Core Web Vitals 首先都是现场指标，但其中许多指标在实验室中也是可以衡量的。
在功能发布给用户之前，实验室衡量是测试功能性能的最佳方式。这也是在性能出现回归问题之前发现问题的最佳方式。
以下工具可用于在实验室环境中衡量 Core Web Vitals：
| LCP | INP | CLS | |
|---|---|---|---|
| Chrome 开发者工具 | |||
| Lighthouse | （请改用 TBT） |
虽然实验室衡量是提供出色体验的重要环节，但它并不能替代现场衡量。
网站的性能可能会因用户的设备功能、网络状况、设备上可能正在运行的其他进程以及用户与网页的互动方式而有很大差异。事实上，每个核心 Web 指标的得分都可能会受到用户互动的影响。只有现场测量才能准确掌握全貌。
提高得分的建议
以下指南提供了有关如何针对每个核心 Web 指标优化网页的具体建议：
有许多方法可以改进核心网页指标，每种方法在每种情况下的影响、相关性和易用性各不相同。如需查看 Chrome 团队的首要建议，请参阅提高核心网页指标的最有效方法。
其他 Web Vitals
虽然 Core Web Vitals 是了解和提供出色用户体验的关键指标，但还有其他辅助指标。
这些其他指标可以用作三项 Core Web Vitals 的指标代理或补充指标，有助于捕获更多体验数据，或帮助诊断特定问题。
例如，首次发送字节时间 (TTFB) 和 首次内容渲染 (FCP) 这两个指标都是加载体验的重要方面，对于诊断 LCP 问题（分别是服务器响应时间缓慢或呈现阻塞资源）都很有用。
同样，Total Blocking Time (TBT) 等实验室指标对于发现和诊断可能影响 INP 的潜在互动性问题至关重要。不过，由于这些指标无法在现场衡量，也无法反映以用户为中心的结果，因此不属于核心 Web 指标集。
网页指标方面的变更
Web Vitals 和 Core Web Vitals 是目前开发者可用来衡量 Web 体验质量的最佳信号，但这些信号并不完美，未来应该会得到改进或增强。
核心网页指标与所有网页相关，并在相关 Google 工具中显示。这些指标的更改将产生广泛影响；因此，开发者应预计核心网页指标的定义和阈值将保持稳定，并且更新会提前通知，并采用可预测的年度节奏。
其他 Web 指标通常因情境或工具而异，并且可能比核心 Web 指标更具实验性。因此，其定义和阈值可能会更频繁地发生变化。
对于所有 Web Vitals，我们都会在此公开的更新日志中明确记录更改。