Defining the Core Web Vitals metrics thresholds

Core Web Vitals是一组字段指标，用于衡量 Web 上真实世界用户体验的重要方面。Core Web Vitals 包括指标，以及每个指标的目标阈值，可帮助开发人员定性地了解其网站的体验是“好”、“需要改进”还是“差”。这篇文章将解释一般用于选择 Core Web Vitals 指标阈值的方法，以及如何选择每个特定 Core Web Vitals 指标的阈值。

复习：核心 Web Vitals 指标和阈值#

2020 年的核心 Web Vitals 是三个指标：最大内容绘制 (LCP)、首次输入延迟 (FID) 和累积布局偏移 (CLS)。每个指标衡量用户体验的不同方面：LCP 衡量感知加载速度并标记页面加载时间轴中页面主要内容可能已加载的时间点；FID 衡量响应能力并量化用户在尝试首次与页面交互时的体验；CLS 测量视觉稳定性并量化可见页面内容的意外布局偏移量。
每个 Core Web Vitals 指标都有相关的阈值，这些阈值将性能分类为“好”、“需要改进”或“差”：

此外，为了对页面或站点的整体性能进行分类，我们使用该页面或站点的所有页面浏览量的第 75 个百分位值。换句话说，如果站点的页面浏览量至少有 75% 达到“良好”阈值，则该站点被归类为该指标的“良好”性能。相反，如果至少 25% 的页面浏览量达到“差”阈值，则该站点被归类为“差”性能。因此，例如，2 秒的第 75 个百分位 LCP 被归类为“好”，而 5 秒的第 75 个百分位 LCP 被归类为“差”。

Core Web Vitals 指标阈值的标准#

在为 Core Web Vitals 指标建立阈值时，我们首先确定了每个阈值必须满足的标准。下面，我将解释我们在 Google 用于评估 2020 Core Web Vitals 指标阈值的标准。随后的部分将更详细地介绍如何应用这些标准来选择 2020 年每个指标的阈值。在未来几年，我们预计会对标准和阈值进行改进和补充，以进一步提高我们衡量卓越用户体验的能力网。

优质的用户体验#

我们的主要目标是针对用户及其体验质量进行优化。鉴于此，我们旨在确保满足 Core Web Vitals“良好”阈值的页面提供高质量的用户体验。
为了确定与高质量用户体验相关的阈值，我们关注人类感知和 HCI 研究。虽然有时使用单个固定阈值来总结这项研究，但我们发现基础研究通常表示为一系列值。例如，对用户在失去焦点之前通常等待的时间量的研究有时被描述为 1 秒，而基础研究实际上表示为一个范围，从数百毫秒到几秒。聚合和匿名的 Chrome 指标数据进一步支持了感知阈值因用户和上下文而异的事实，这表明用户在中止页面加载之前等待网页显示内容的时间不是单一的。相反，该数据显示出平滑且连续的分布。Web Vitals 背后的科学。
如果相关用户体验研究可用于给定指标，并且对文献中的值范围有合理的共识，我们会使用该范围作为输入来指导我们的阈值选择过程。在相关用户体验研究不可用的情况下，例如对于像 Cumulative Layout Shift 这样的新指标，我们会评估满足不同指标候选阈值的现实世界页面，以确定导致良好用户体验的阈值。

可通过现有网络内容实现#

此外，为确保网站所有者能够成功优化其网站以满足“良好”阈值，我们要求网络上的现有内容可以达到这些阈值。例如，虽然零毫秒是理想的 LCP“良好”阈值，导致即时加载体验，但由于网络和设备处理延迟，在大多数情况下实际上无法实现零毫秒阈值。因此，零毫秒对于 Core Web Vitals 来说不是一个合理的 LCP“好”阈值。
在评估候选 Core Web Vitals“良好”阈值时，我们会根据Chrome 用户体验报告(CrUX) 中的数据验证这些阈值是否可以实现。为了确认一个阈值是可以实现的，我们要求至少 10% 的来源当前满足“良好”阈值。此外，为了确保优化良好的站点不会因现场数据的可变性而被错误分类，我们还验证优化良好的内容始终满足“良好”阈值。
相反，我们通过确定只有少数来源当前未达到的性能水平来确定“差”阈值。除非有与定义“差”阈值相关的研究可用，否则默认情况下，表现最差的 10-30% 的起源被归类为“差”。

关于标准的最终想法#

在评估候选阈值时，我们发现这些标准有时会相互冲突。例如，在始终可实现的阈值与确保始终如一的良好用户体验之间可能存在紧张关系。此外，鉴于人类感知研究通常提供一系列值，并且用户行为指标显示行为的逐渐变化，我们发现指标通常没有单一的“正确”阈值。因此，我们对 2020 Core Web Vitals 的方法是选择最符合上述标准的阈值，同时认识到没有一个完美的阈值，我们有时可能需要从多个合理的候选阈值中进行选择。而不是问“什么是完美的门槛？” 相反，我们专注于询问“

百分位选择#

如前所述，为了对页面或站点的整体性能进行分类，我们使用对该页面或站点的所有访问的第 75 个百分位值。根据两个标准选择第 75 个百分位数。首先，百分位数应确保对页面或站点的大多数访问都达到目标性能水平。其次，所选百分位数的值不应受到异常值的过度影响。
这些目标彼此有些矛盾。为了满足第一个目标，更高的百分位数通常是更好的选择。但是，随着百分位数的增加，结果值受异常值影响的可能性也会增加。如果对站点的几次访问碰巧是在不稳定的网络连接上，导致 LCP 样本过大，我们不希望我们的站点分类由这些异常样本决定。例如，如果我们使用高百分位数（例如第 95 个百分位数）评估一个有 100 次访问的网站的性能，那么第 95 个百分位数的值只需要 5 个异常值样本就会受到异常值的影响。
鉴于这些目标有点不一致，经过分析，我们得出结论，第 75 个百分位数达到了合理的平衡。通过使用第 75 个百分位数，我们知道对网站的大多数访问（4 次中的 3 次）都达到了目标性能水平或更高。此外，第 75 个百分位值受异常值影响的可能性较小。返回到我们的示例，对于具有 100 次访问的站点，其中 25 次访问需要报告大量异常值样本，以便在第 75 个百分位处的值受异常值影响。虽然 100 个样本中有 25 个可能是异常值，但与 95% 的情况相比，这种可能性要小得多。

最大的内容绘制#

体验质量#

1 秒通常被认为是用户在开始对任务失去注意力之前等待的时间。通过对相关研究的仔细检查，我们发现 1 秒是描述一系列值的近似值，从大约几百毫秒到几秒不等。
1 秒阈值的两个常用来源是Card et al和Miller。Card 引用了 Newell 的统一认知理论，定义了 1 秒的“立即响应”阈值。纽厄尔将即时反应解释为“必须在大约一秒钟内对某些刺激做出的反应（也就是说，大约从~0.3 秒到~3 秒）。”这是在纽厄尔关于“认知的实时约束”的讨论之后，其中指出“与环境的交互引起认知考虑发生在几秒的数量级” 大约从 0.5 秒到 2-3 秒不等。米勒是 1 秒阈值的另一个常用来源，他指出“如果响应延迟超过两秒，人类可以并且将通过机器通信执行的任务将严重改变他们的性格，可能会再延长一秒左右。”
Miller 和 Card 的研究将用户在失去焦点之前等待的时间描述为一个范围，从大约 0.3 到 3 秒，这表明我们的 LCP“好”阈值应该在这个范围内。此外，鉴于现有的首次内容绘制“良好”阈值为 1 秒，并且最大内容绘制通常发生在首次内容绘制之后，我们进一步将候选 LCP 阈值的范围限制为 1 秒到 3 秒。为了在这个范围内选择最符合我们标准的阈值，我们在下面查看这些候选阈值的可实现性。

可实现性#

使用来自 CrUX 的数据，我们可以确定网络上满足我们候选 LCP“良好”阈值的来源百分比。
被归类为“良好”的 CrUX 来源的百分比（对于候选 LCP 阈值）

虽然少于 10% 的来源满足 1 秒阈值，但 1.5 到 3 秒的所有其他阈值满足我们的要求，即至少 10% 的来源满足“良好”阈值，因此仍然是有效的候选者。
此外，为确保优化良好的站点始终可以达到所选阈值，我们分析了网络上表现最佳的站点的 LCP 性能，以确定这些站点始终可以实现哪些阈值。具体来说，我们的目标是确定一个阈值，该阈值始终可以在表现最佳的网站的第 75 个百分位数处实现。我们发现 1.5 秒和 2 秒阈值并非始终可以实现，而 2.5 秒始终可以实现。
为了确定 LCP 的“差”阈值，我们使用 CrUX 数据来确定大多数来源满足的阈值：
被归类为“差”的 CrUX 来源的百分比（对于候选 LCP 阈值）

对于 4 秒的阈值，大约 26% 的手机来源和 21% 的桌面来源将被归类为差。这落在我们 10-30% 的目标范围内，因此我们得出结论，4 秒是可接受的“差”阈值。
因此，我们得出结论，对于 Largest Contentful Paint，2.5 秒是一个合理的“好”阈值，4 秒是一个合理的“差”阈值。

首次输入延迟#

体验质量#

研究得出的结论是，长达 100 毫秒左右的视觉反馈延迟被认为是由相关来源（例如用户输入）引起的。这表明 100 毫秒的首次输入延迟“良好”阈值可能适合作为最小条：如果处理输入的延迟超过 100 毫秒，则其他处理和渲染步骤没有机会及时完成。
Jakob Nielsen 经常引用的“响应时间：3 个重要限制”将 0.1 秒定义为让用户感觉系统正在立即做出反应的限制。Nielsen 引用了 Miller 和 Card，后者引用了 Michotte 1962 年的《因果关系感知》. 在 Michotte 的研究中，实验参与者看到“屏幕上有两个物体。物体 A 开始向 B 移动。它在与 B 接触的那一刻停止，而后者则开始并远离 A。” Michotte 改变对象 A 停止和对象 B 开始移动之间的时间间隔。Michotte 发现，对于大约 100 毫秒的延迟，参与者有一种印象是对象 A 导致了对象 B 的运动。对于大约 100 毫秒到 200 毫秒的延迟，因果关系的感知是混合的，对于超过 200 毫秒的延迟，对象的运动B 不再被视为是由对象 A 引起的。
类似地，米勒将“对控制激活的响应”定义为“通常由键、开关或其他控制部件的移动给出的动作指示，表明它已被物理激活。这种响应应该……感知作为操作者引起的机械动作的一部分。时间延迟：不超过0.1秒”及以后“按下按键和视觉反馈之间的延迟应不超过0.1到0.2秒”。
最近，在Towards the Temporally Perfect Virtual Button 中，Kaaresoja 等人研究了在触摸触摸屏上的虚拟按钮和随后的指示按钮被触摸的视觉反馈之间的同时性感知，对于各种延迟。当按下按钮和视觉反馈之间的延迟为 85 毫秒或更短时，参与者报告在 75% 的时间里视觉反馈与按下按钮同时出现。此外，对于 100 毫秒或更短的延迟，参与者报告按钮按下的感知质量始终很高，感知质量在 100 毫秒到 150 毫秒的延迟中下降，并且在 300 毫秒的延迟中达到非常低的水平。
鉴于上述情况，我们得出结论，研究指出 100 毫秒左右的值范围是 Web Vitals 的合适的首次输入延迟阈值。此外，鉴于用户报告延迟 300 毫秒或更长的低质量级别，300 毫秒呈现为合理的“差”阈值。

可实现性#

使用来自 CrUX 的数据，我们确定网络上的大多数来源在第 75 个百分位数处满足 100 毫秒 FID“良好”阈值：
FID 100ms 阈值被归类为“良好”的 CrUX 来源的百分比

此外，我们观察到网络上的顶级网站能够始终在第 75 个百分位（并且通常在第 95 个百分位处）达到此阈值。
鉴于上述情况，我们得出结论，100 毫秒是 FID 的合理“良好”阈值。

累积布局移位#

体验质量#

累积布局偏移 (CLS) 是一种新指标，用于衡量页面可见内容的偏移量。鉴于 CLS 是新的，我们不知道可以直接告知该指标阈值的研究。因此，为了确定符合用户期望的阈值，我们评估了具有不同布局偏移量的现实世界页面，以确定在使用页面内容时造成重大中断之前被认为可接受的最大偏移量。在我们的内部测试中，我们发现从 0.15 及以上的变化水平一直被认为是破坏性的，而 0.1 及以下的变化是明显的，但不是过度破坏性的。因此，虽然零布局偏移是理想的，但我们得出的结论是，高达 0.1 的值是候选“良好”CLS 阈值。

可实现性#

根据 CrUX 数据，我们可以看到近 50% 的来源的 CLS 为 0.05 或更低。
归类为“良好”的 CrUX 来源的百分比（对于候选 CLS 阈值）

虽然 CrUX 数据表明 0.05 可能是一个合理的 CLS“好”阈值，但我们认识到，在某些用例中，目前难以避免破坏性布局转换。例如，对于第三方嵌入内容，例如社交媒体嵌入，嵌入内容的高度有时在完成加载之前是未知的，这可能导致布局偏移大于 0.05。因此，我们得出的结论是，虽然许多来源满足 0.05 阈值，但稍微不太严格的 CLS 阈值 0.1 在体验质量和可实现性之间取得了更好的平衡。我们希望，在未来，网络生态系统将确定解决第三方嵌入引起的布局变化的解决方案，这将允许使用更严格的 CLS“良好”阈值 0。
此外，为了确定 CLS 的“差”阈值，我们使用 CrUX 数据来确定大多数来源满足的阈值：
被归类为“差”的 CrUX 来源的百分比（对于候选 CLS 阈值）

对于 0.25 阈值，大约 20% 的手机来源和 18% 的桌面来源将被归类为“差”。这落在我们 10-30% 的目标范围内，因此我们得出结论，0.25 是可接受的“差”阈值。