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 变量。将它们放置在文档 head 的 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 进行过滤。这将为您专门提供经过身份验证的用户结账变体的性能。如果不进行自定义工程工作,没有其他监控工具能够呈现这种组合。
标准技术维度告诉您浏览器体验到了什么。自定义维度告诉您业务体验到了什么。400 毫秒的 LCP 回退,在运行付费流量的 landing-page 上与在 blog 文章上意味着截然不同的事情。这些区别对于优先级排序至关重要,而优先级排序正是性能优化工作成功或停滞的地方。