Core Web Vitals ↗ 是 Google 设计的高级指标，旨在捕捉用户体验。测量三个核心 Web Vitals 指标：Largest Contentful Paint、First Input Delay 和 Cumulative Layout Shift。根据 Google 设计的行业标准方法和测试，这些指标中的每一个都会自动分配“好”、“需要改进”或“差”的评级。页面加载时间统计数据由 First Paint 和 First Contentful Paint 补充。
Core Web Vitals 允许您以直观的形式轻松找出网页中哪些元素正在影响用户在浏览您网站时的体验。 要访问 Core Web Vitals：
-
在 Cloudflare 仪表板中，转到 Web Analytics（Web 分析） 页面。
Go to Web analytics ↗ -
选择您的网站，然后选择 Core Web Vitals（核心网页指标）。
Core Web Vitals 分为三个主要部分，每个部分都包含有关影响用户体验的特定功能的信息：
- Largest Contentful Paint (LCP) ↗：测量用户感知到的加载速度。它返回页面的主要内容加载所需的时间。
- Interaction to Next Paint (INP) ↗：衡量用户界面的响应能力——网站对点击或按键等用户交互的响应速度。
- Cumulative Layout Shift (CLS) ↗：测量视觉稳定性，即随着各种元素加载到视图中，页面布局是否发生偏移。
这些指标中的每一个都代表了对用户体验的影响，由 Web Analytics 进行量化和评级。
Cloudflare Web Analytics 允许您按 URL、浏览器、操作系统、国家/地区和元素过滤数据，从而在 Core Web Vitals 中进行交互式探索。
在每个图表下方，调试视图（Debug View）部分列出了对每个指标有负面影响的前五个元素。在数据表中选择显示的元素可为您提供有关它们的更多详细信息。
每张表——LCP、INP 和 CLS——还可以让您一目了然地看到这些元素在第 75 个百分位 (P75) 的表现。在表格的每一行中选择可让您展开该元素并访问更多信息，包括 P50、P90 和 P99 指标。
这些数字指的是某个元素相对于页面中其他元素的性能。例如，如果一个元素需要 3,900 毫秒才能加载完毕，并且位于第 75 个百分位，这意味着它的加载速度比页面中 75% 的元素慢。
Web Analytics 使用其轻量级 JavaScript beacon 来收集 Vitals Explorer 使用的信息。它不使用任何客户端状态（如 Cookie 或 localStorage）来收集使用指标。Vitals Explorer 也不通过个人的 IP 地址、User Agent 字符串或任何其他数据来追踪个人的指纹。
代表 DOM 节点的 CSS 选择器。借助此字符串，您可以在浏览器的开发控制台中使用 document.querySelector(<element_name>) 找出哪个 DOM 节点对您的分数/值有负面影响。
捕获 Core Web Vitals 时的 URL 路径。
每个 Core Web Vitals 的指标值 ↗。此值对于 LCP 或 NIP 是毫秒，对于 CLS 则是分数。
源 URL（如图像、文本、Web 字体）。
源对象的大小，以字节为单位。
布局信息是一个 JSON 值，其中包括宽度、高度、x 轴位置、y 轴位置、左、右、上和下。这些值表示页面上发生的布局偏移。
在页面中发生偏移之后，捕获面积最大的 DOM 元素的布局信息。此 JSON 值在 Debug View（调试视图） 部分显示为 Current（当前）。要访问它，请滚动至 Cumulative Layout Shifts (CLS) 图表 > Debug View（调试视图）。从该表中选择任何元素即可访问 Layout Shifts（布局偏移） 部分，其中展示了 Current（当前）。
在页面中发生偏移之前，捕获面积最大的 DOM 元素的布局信息。此 JSON 值在 Debug View（调试视图） 部分显示为 Previous（之前）。要访问它，请滚动至 Cumulative Layout Shifts (CLS) 图表 > Debug View（调试视图）。从该表中选择任何元素即可访问 Layout Shifts（布局偏移） 部分，其中展示了 Previous（之前）。