CoreDash 中的自定义细分
国家和设备类型等技术维度是根据浏览器信号构建的。CoreDash 会自动收集它们。这里涵盖的三个维度则有所不同:页面标签 (Page Label)、A/B 测试 (A/B Test)和登录状态 (Logged In Status)是由用户定义的。您可以在 CoreDash 运行之前,通过在自己的代码中分配 window 变量来设置它们。
这种从自动到主动的转变正是核心所在。您的应用程序知道浏览器无法推断的事情:用户正在查看哪个结账变体,当前 URL 是产品详情页还是着陆页,用户是否已通过身份验证。将该上下文传递给 CoreDash 意味着您的性能数据能够反映您业务的实际运作方式。

页面标签 (lb)
页面标签维度让您能够按业务功能而不是 URL 结构对页面进行分组。像这样定义它:
window.__CWVL = 'mypagelabel';
典型值:checkout、product-detail、landing-page、category、search-results、account。该值是您控制的任意字符串。
为什么这很重要
基于 URL 的分析存在一个根本性的扩展问题。一个大型电子商务网站可能有 50,000 个产品详情页。它们的 URL 类似于 /products/blue-widget-32oz 和 /products/red-gadget-xl。它们是相同的模板,相同的业务功能,相同的优化目标。一次分析一个 URL 毫无用处。将它们归类在 product-detail 下,可以为您提供整个产品目录的单一性能配置文件。
页面标签还可以区分服务于不同性能预算的页面。结账页面有一个可接受的 LCP 阈值,因为它带来直接收入。博客文章则有不同的容忍度。运行付费流量的着陆页对缓慢的 LCP 零容忍,因为每一毫秒都在消耗您的广告支出。
一旦按业务功能为页面贴上标签,您就可以在 CoreDash 中为每个标签设置不同的警报阈值,并将正确的警报路由给正确的团队。
A/B 测试 (ab)
A/B 测试维度包含一个标签,您将其分配给用户当前正在体验的变体。像这样定义它:
window.__CWAB = 'my page version';
该值是任意的。variant-a 和 variant-b 是显而易见的选择,但您可以使用任何映射到您的实验平台变体标识符的字符串。
为什么这很重要
A/B 测试是意外性能退化的最常见来源之一。变体 B 交付了一个新的主图轮播。变体 B 加载了一个第三方推荐小部件。变体 B 包含了一轮额外的 React 水合 (hydration)。所有这些都带来了您的实验工具几乎肯定无法测量的性能成本。
大多数实验平台跟踪转化率和收入。它们不跟踪 p75 LCP 或 INP。如果变体 B 的转化率提高了 2%,但在移动设备上的加载速度慢了 400 毫秒,您需要在将其推广到 100% 流量之前了解这一点。随着用户失去耐心,性能成本可能会在下个季度抹去转化带来的收益。
设置了 __CWAB 后,打开 CoreDash,按 ab = variant-b 进行过滤,并将 Core Web Vitals 与对照组进行并排比较。我见过一些 A/B 测试中,获胜变体的 p75 LCP 比对照组差 600 毫秒,因为它加载了更重的字体。业务团队看到了转化提升;他们没有看到性能退化。这正是此维度所要防止的。
登录状态 (li)
登录状态维度记录当前用户是否已通过身份验证。像这样定义它:
window.__CWVLI = 1; // 已登录 window.__CWVLI = 0; // 未登录
为什么这很重要
登录用户收到的页面与匿名访客有着本质的不同。他们的请求绕过了许多 CDN 缓存层。服务器运行数据库查询以获取个性化内容:用户的购物车、订单历史记录、保存的物品。这些服务器端工作直接增加了 TTFB。
在前端,经过身份验证的页面通常会加载更多的 JavaScript:账户小部件、通知系统、购物车响应性等。它们也可能跳过使匿名页面变快的预渲染或边缘缓存。结果是,登录用户通常会体验到比匿名用户更慢的性能,然而登录用户通常是您价值最高的客户。他们已经转化。他们是您最需要留住的人群。
如果没有 li 维度,缓慢的身份验证性能就会隐藏在您的汇总数据中。您的匿名 LCP 可能是 1.8 秒,而您的登录 LCP 是 3.4 秒。汇总数据显示为 2.3 秒,看起来似乎可以接受。但按 li 细分后,情况就完全不同了。
实现
所有三个维度都使用相同的模式:在 CoreDash 代码段执行之前设置一个 window 变量。将它们放在文档头部的 script 标签中,或放在应用程序的初始化代码中:
// 根据您的应用状态设置所有三个变量 window.__CWVL = 'checkout'; // 页面标签 window.__CWAB = 'variant-b'; // A/B 测试变体 window.__CWVLI = 1; // 已登录
标签值是字符串(__CWVLI 除外,它接受 1 或 0)。在您的代码库中保持它们的一致性。如果在某个模板中使用 product-detail,而在另一个模板中使用 productDetail,CoreDash 会将它们视为两个独立的片段,从而导致数据碎片化。请选择一种约定并强制执行。
结合所有三个维度
当您将这些维度叠加在一起时,真正的价值就会显现。您正在为登录用户的结账页面进行 A/B 测试。您想知道变体 B 是使经过身份验证的结账体验变得更快还是更慢。
在 CoreDash 中,按 ab = variant-b 加上 lb = checkout 加上 li = 1 进行过滤。这会为您提供经过身份验证的用户特定的结账变体性能。如果没有您这边进行自定义工程开发,没有任何其他监控工具能展示这种组合数据。
标准技术维度告诉您浏览器体验到了什么。自定义维度告诉您业务体验到了什么。在运行付费流量的 landing-page 上与在 blog 文章上,400 毫秒的 LCP 退化意味着截然不同的事情。这些区别对于优先级排序至关重要,而优先级排序正是性能工作成功或停滞的关键所在。