如何在 Looker Studio 上构建 CrUX 信息中心

Looker Studio(以前称为“数据洞察”)是一款强大的数据可视化工具,可让您基于 Chrome 用户体验报告 (CrUX) 等大数据源构建信息中心。在本指南中,了解如何创建您自己的自定义 CrUX 信息中心以跟踪来源的用户体验趋势。

<ph type="x-smartling-placeholder">
</ph> CrUX 信息中心的屏幕截图,其中显示在不同月份发生变化的各种堆栈条形图。
CrUX 信息中心

CrUX 信息中心使用名为社区连接器的 Looker Studio 功能构建而成。此连接器是 BigQuery 上的原始 CrUX 数据与 Looker Studio 可视化图表之间的预先建立的关联。使用信息中心的用户无需编写任何查询或生成任何图表。一切都为您量身定制;您只需提供一个来源,系统就会为您生成自定义信息中心。

默认的 CrUX 信息中心

CrUX 有一个由 CrUX 团队维护的默认信息中心。团队会添加新指标(例如 INP),并在下一次加载信息中心时使用。

<ph type="x-smartling-placeholder">

创建自定义信息中心

某些用户可能想要自定义信息中心,在这种情况下,您可以创建自己的默认信息中心副本,并根据需要进行更改。

<ph type="x-smartling-placeholder">

若要创建自定义信息中心,请访问 g.co/chromeuxdash。系统会将您转到 CrUX 社区连接器页面,您可以在其中提供生成信息中心的来源。请注意,新用户可能需要按权限提示或营销偏好设置提示进行相应操作。

<ph type="x-smartling-placeholder">
</ph> CrUX 信息中心连接器配置屏幕的屏幕截图,其中包含一个用于输入来源网址的字段和一个复选框,以允许在报告中修改该字段。
CrUX 信息中心连接器

文本输入字段仅接受源站,而不接受完整网址。例如:

来源(支持)
https://developer.chrome.com
网址(不支持)
https://developer.chrome.com/docs/crux/guides/looker-studio-dashboard

如果您省略协议,系统会假定使用 HTTPS。子网域很重要,例如 https://developers.google.comhttps://www.google.com 被视为不同的源。

源站的一些常见问题包括:提供错误的协议(例如,使用 http:// 而不是 https://),以及根据需要省略子网域。某些网站包含重定向,因此,如果 http://example.com 重定向到 https://www.example.com,则应使用后者,即源的规范版本。一般来说,请使用用户在地址栏中看到的源。

勾选该复选框后,源站将包含在信息中心网址中,这样,您可以在日后更改此网址参数(因此建议您勾选此复选框),以便对不同的源站使用同一信息中心。

点击连接按钮。如果您勾选了此复选框,系统会要求您确认。

如果您的来源未包含在 CrUX 数据集中,您可能会收到如下图所示的错误消息。数据集中有超过 1, 500 万个源,但您希望包含的源可能没有足够的数据

<ph type="x-smartling-placeholder">
</ph> 一条弹出式错误消息的屏幕截图,其中带有一条其他错误消息:“此数据集中有超过 1500 万个源,但 https://doesnotexist.origin 不是其中之一”
源不存在时的 CrUX 社区连接器错误消息

如果源存在,系统会将您转到信息中心的架构页面。这会显示包含的所有字段:每个有效连接类型、每个设备规格、数据集发布的月份、每个指标的性能分布,当然还有源站的名称。您无需在此页面上执行任何操作,也无需执行任何操作,只需点击创建报告即可继续。

<ph type="x-smartling-placeholder">
</ph> CrUX Dashboard 架构编辑器的屏幕截图,其中包含各种字段、类型、聚合和说明,并且能够更改这些字段或添加新字段。
CrUX 信息中心架构

使用信息中心

每个信息中心都有三种类型的页面:

  1. Core Web Vitals 概览
  2. 指标效果
  3. 用户受众特征

每个页面都包含一个图表,其中显示了每个可用的每月发布版本随时间的分布情况。新数据集发布后,您可以刷新信息中心以获取最新数据。

每月数据集在每个月的第二个星期二发布。例如,包含 5 月份用户体验数据的数据集将于 6 月的第二个星期二发布。

Core Web Vitals 概览

第一页简要介绍了该源的每月核心网页指标性能。这些是 Google 建议您关注的最重要的用户体验指标。

<ph type="x-smartling-placeholder">
</ph> CrUX 信息中心 Core Web Vitals 概览的屏幕截图,其中显示了 LCP、INP 和 CLS 指标信息。
CrUX 信息中心 Core Web Vitals 概览

使用“Core Web Vitals”页面了解桌面设备和手机用户对来源的体验。默认情况下,系统将选择您创建信息中心时最近的月份。如需在较旧或较新的每月版本之间切换,请使用页面顶部的月份过滤条件。

请注意,默认情况下,这些图表会忽略平板电脑,但如果需要,您可以移除条形图配置中的“无平板电脑”过滤条件:

<ph type="x-smartling-placeholder">
</ph> 在 Looker Studio 中修改“过滤条件”选项的屏幕截图。
修改 CrUX 信息中心以便在“Core Web Vitals”页面上显示平板电脑

指标效果

在“Core Web Vitals”页面之后,您可以找到 CrUX 数据集内所有指标的独立页面。

<ph type="x-smartling-placeholder">
</ph> CrUX 信息中心 LCP 页面的屏幕截图,其中显示各种堆栈条形图在不同月份的变化。
CrUX 信息中心 LCP 页面

每个页面的顶部都有设备过滤器,您可以使用该过滤器来限制体验数据中包含的设备类型。例如,您可以专门深入分析手机体验。此设置在所有网页上保持不变。

这些页面上的主要可视化图表是按月划分的“良好”“需要改进”和“欠佳”体验分布情况。图表下方以不同颜色显示的图例表示相应类别所包含的体验范围。例如,在前面的屏幕截图中,您可以看到最近几个月,Largest Contentful Paint (LCP) 表现有所波动,并且有些变差。

最近一个月的“良好”状态所占的百分比和“很差”体验,以及一个指标(这些指标表示与上个月相比的百分比变化)。对于此来源,“good”(好)LCP 体验环比下降了 3.2% 至 56.04%。

此外,对于 LCP 等指标和其他提供明确百分位建议的 Core Web Vitals 指标,系统会显示“P75”“良好”指标之间的和“很差”百分比。此值对应于相应来源的用户体验的第 75 百分位。换句话说,75% 的体验优于此值。需要注意的一点是,这适用于源站上所有设备的总体分布。如果使用设备过滤条件切换特定设备,系统将不会重新计算百分位。

有关百分位的技术注意事项

请注意,百分位指标基于 BigQuery 的直方图数据,因此粒度比较粗略:LCP 为 100 毫秒,INP 为 25 毫秒,CLS 为 0.05 毫秒。换句话说,3800 毫秒的 P75 LCP 表示实际的第 75 百分位介于 3800 毫秒到 3900 毫秒之间。

此外,BigQuery 数据集还使用一种称为“分箱扩散”的技术。其中,用户体验的密度本质上分组到非常粗略的分箱(以递减方式排列)。这样,我们便可以在分布的尾部包含分钟密度,而无需超过四位数的精度。例如,小于 3 秒的 LCP 值会被分到宽度为 200 毫秒的分箱中。分箱的宽度介于 3 到 10 秒之间,宽度为 500 毫秒。超过 10 秒,分箱宽度为 5000 毫秒...分箱扩展不是具有不同宽度的分箱,而是确保所有分箱的宽度都是 100 毫秒的恒定(最大公约数),并且每个分箱的分布采用线性插值法。

PageSpeed Insights 等工具中对应的 P75 值并非基于公共 BigQuery 数据集,能够提供毫秒级精度值。

用户受众特征

用户受众特征页面包含两个维度:设备和有效连接类型 (ECT)。这些页面显示了每个受众特征的用户在整个来源中的网页浏览量分布情况。

“设备分布”页面会显示一段时间内手机用户、桌面设备用户和平板电脑用户的详细信息。许多源通常只有很少的平板电脑数据,甚至没有,因此经常会显示“0%”悬浮在图表边缘

<ph type="x-smartling-placeholder">
</ph> CrUX 信息中心设备页面的屏幕截图,其中显示了设备细分数据逐月变化的情况。
CrUX 信息中心设备页面

同样,ECT 分发页面会显示 4G、3G、2G、慢速 2G 和离线体验的细分数据。

这些维度的分布是使用 First Contentful Paint (FCP) 直方图数据。

常见问题解答

以下是有关在 Looker Studio 上构建 CrUX 信息中心的一些常见问题解答:

何时会使用 CrUX 信息中心,而不是其他工具?

CrUX 信息中心基于 BigQuery 中提供的相同基础数据,但您无需编写一行 SQL 来提取数据,也无需担心超出任何免费配额。与查看查询底层数据相比,设置信息中心更快速、更轻松,系统会为您生成所有可视化内容,您可以与任何人共享这些数据。

使用 CrUX 信息中心是否有任何限制?

基于 BigQuery,意味着 CrUX 信息中心还继承了其所有限制。只能以每月粒度显示源级数据。

为简单性和便利性,CrUX 信息中心还牺牲了 BigQuery 上原始数据的一些通用性。例如,指标分布仅以“良好”“需要改进”和“差”表示,而不是完整直方图。CrUX 信息中心还提供全球级数据,而 BigQuery 数据集可让您放大查看特定国家/地区的数据。

在哪里可以详细了解 Looker Studio?

如需了解详情,请参阅 Looker Studio 功能页面