Core/Dash 维度: 自定义标签与细分

衡量真正关键的性能:按 A/B 测试版本、业务页面类型和登录状态,而不只是按 URL。

免费试用

Trusted by market leaders · Client results

aleteiadpg mediamarktplaatsharvardnina caresaturnworkivacomparehappyhorizonebaynestlefotocasasnvkpnmonarchmy work featured on web.devadevintaloopearplugsvpnwhowhatwearerasmusmcperion

CoreDash 中的自定义细分

国家和设备类型等技术维度基于浏览器信号。CoreDash 会自动收集它们。这里讲的三个维度不同:页面标签A/B 测试登录状态是用户自定义的。你要在 CoreDash 运行前,在自己的代码里给 window 变量赋值来设置它们。

从自动收集转向主动设置,这正是核心目的。你的应用了解浏览器无法推断的信息:用户正在看哪个结账版本,当前 URL 是产品详情页还是落地页,用户是否已认证。将这些上下文传给 CoreDash,意味着你的性能数据能反映业务的实际运行情况。

coredash page label

页面标签 (lb)

页面标签维度让你能按业务功能而不是 URL 结构对页面进行分组。像这样定义它:

window.__CWVL = 'mypagelabel';

典型值:checkoutproduct-detaillanding-pagecategorysearch-resultsaccount。这个值是你控制的任意字符串。

为什么这很重要

基于 URL 的分析存在根本的规模扩张问题。一个大型电商网站可能有 5 万个产品详情页。它们的 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-avariant-b 是显而易见的选择,但你可以使用任何映射到你实验平台版本标识符的字符串。

为什么这很重要

A/B 测试是意外性能退化最常见的来源之一。版本 B 上线了一个新的首屏图片轮播。版本 B 加载了一个第三方推荐组件。版本 B 多了一轮额外的 React hydration。所有这些都带来了性能成本,而你的实验工具几乎肯定没有衡量这些成本。

大多数实验平台追踪转化率和收入。它们不追踪 p75 的 LCP 或 INP。如果版本 B 的转化率高 2%,但在移动端加载慢了 400 毫秒,你需要在将其全量发布前知道这一点。随着用户失去耐心,这种性能成本可能会在下个季度吃掉转化率带来的收益。

设置好 __CWAB 后,打开 CoreDash,按 ab = variant-b 过滤,并将 Core Web Vitals 与对照组并排比较。我见过有些 A/B 测试里,获胜版本的 p75 LCP 比对照组慢了 600 毫秒,因为它加载了更重的字体。业务团队看到了转化率提升;他们没看到性能退化。这就是该维度要防范的问题。

登录状态 (li)

登录状态维度记录当前用户是否已认证。像这样定义它:

window.__CWVLI = 1; // logged in
window.__CWVLI = 0; // logged out

为什么这很重要

已登录用户看到的页面与匿名访客有根本区别。他们的请求会绕过许多 CDN 缓存层。服务器会执行数据库查询来获取个性化内容:用户的购物车、订单历史、收藏夹。这些服务器端工作会直接增加 TTFB。

在前端,已认证页面通常加载更多 JavaScript:账户组件、通知系统、购物车响应式逻辑。它们也可能跳过那些让匿名页面变快的预渲染或边缘缓存。结果是,已登录用户的性能体验通常比匿名用户慢,但已登录用户往往是你最有价值的客户。他们已经完成了转化。他们是你最需要留住的人。

如果没有 li 维度,缓慢的已认证性能就会掩盖在聚合数据里。你的匿名 LCP 可能是 1.8 秒,而已登录 LCP 是 3.4 秒。总数据是 2.3 秒,看起来还能接受。按 li 拆分后,情况完全不同。

实现

所有三个维度都遵循同样的模式:在 CoreDash 代码段执行前设置一个 window 变量。将它们放在你文档头部的 script 标签中,或放在你的应用初始化代码里:

// Set all three based on your app state
window.__CWVL  = 'checkout';      // page label
window.__CWAB  = 'variant-b';     // A/B test variant
window.__CWVLI = 1;               // logged in

标签值是字符串(除了 __CWVLI 接受 10)。要在你的整个代码库中保持它们一致。如果你在一个模板中使用 product-detail,而在另一个模板中使用 productDetail,CoreDash 会将它们视为两个独立的细分,你的数据就会碎片化。选定一种约定并严格执行。

组合使用这三个维度

当你将这些维度叠加在一起时,真正的价值就会显现。你正在为已登录用户的结账页进行 A/B 测试。你想知道版本 B 是让已认证的结账体验变快了还是变慢了。

在 CoreDash 中,按 ab = variant-b 加上 lb = checkout 加上 li = 1 进行过滤。这样就能专门得出已认证用户的结账版本性能。如果不进行自定义开发,没有其他监控工具能展示这种组合。

标准技术维度反映浏览器的体验。自定义维度反映业务的体验。LCP 慢了 400 毫秒,对于跑付费流量的 landing-pageblog 文章来说,意味完全不同。这些区别对排定优先级至关重要,而排定优先级决定了性能优化是成功还是停滞。