你所说的'Core Web Vitals score'到底是什么？

"我们的 Core Web Vitals scores 在下降。你能帮忙吗？"

这是我每天都会被问到好几次的问题。我首先需要问自己的是'你所说的这个 Core Web Vitals score 到底是什么？'当人们联系我时，他们刚刚发现自己的页面速度有问题，而且无法自行修复。通常这意味着他们的实验室数据（Lighthouse）或现场数据（CrUX 和 RUM）未能通过。

所以如果有人告诉你他们的 Core Web Vitals 未通过，你首先需要弄清楚的是他们 谈论的是实验室数据还是现场数据。一个很好的判断指标是，如果他们提到了这个'Core Web Vitals Score'，那么他们谈论的就是实验室数据（Lighthouse）。

糟糕，这是一个 Lighthouse 分数

当我进一步询问那个神奇的'Core Web Vitals Score'时，此时很多联系我的人都会给我展示一个未通过的 Lighthouse 分数。这就是事情变得棘手的地方！Lighthouse 分数未通过并不意味着你的 Core Web Vitals 未通过。同样，一个'绿色'的 Lighthouse 分数也不意味着你通过了 Core Web Vitals。它只是意味着你未通过或通过了这个非常具体的测试。

告诉他们关于现场数据

所以我接下来做的就是告诉他们关于现场数据的事。在这种情况下就是 CrUX 数据。CrUX 代表 Chrome User Experience Report。CrUX 是一个反映真实 Chrome 用户在网络上体验热门目标站点情况的数据集。

CrUX 是 Web Vitals 计划的官方数据集。这意味着要通过（或未通过）Core Web Vitals 的 3 个指标（LCP、INP 和 CLS），至少 75% 的访问者需要有良好的体验。

所以现在你可能理解了，并不存在一个单一的'Core Web Vitals Score'能让你通过或未通过 Core Web Vitals。

向他们展示现场数据

过程 很简单。在浏览器中导航到 pagespeed.web.dev 并输入 URL。然后选择 Origin（位于'This URL'旁边）以显示整个网站的 Core Web Vitals，而不仅仅是首页。

那么 Lighthouse 呢？

到了这个时候，在你提出了令人信服的论据并基本向他们证明了我刚才所说的之后，99% 的客户仍然不愿意放弃 Lighthouse 分数。我理解。它有一种吸引力。很难想象 那些任何人都能解读的绿色、橙色和红色数字实际上完全不重要。

但你需要记住 Lighthouse 是一个测试。它是一个非常酷的测试。我喜欢它所做的很多事情，我喜欢它的编码方式，我喜欢它能帮助你修复一些 Core Web Vitals 问题。但有 3 件事它做不到：

1. 与页面交互。这基本上使得测试不可用。访问者会与你的页面交互。从这种交互中你会获得转化。

2. 作为回访访客。Lighthouse（默认情况下，你可以更改此设置）访问你的页面时就好像从未访问过你的页面一样。通常对于页面渲染和页面计时来说，这会产生天壤之别。所以 Lighthouse 并不能代表你的大部分访问者。

3. 理解你页面的任何内容。最好的例子是 Total Blocking Time 审计。即使大多数专家都同意大量的 Total Blocking Time 是一件坏事，但这并不是全部。只要'阻塞'不发生在页面需要响应的时候（你可以强制做到这一点！），并且阻塞不发生在早期渲染期间，即使你得到了一个不好的 Lighthouse 分数，你也可能完全没问题！