返回博客

2 KB 分析追踪器如何让你的 Core Web Vitals 保持绿色

传统分析脚本足够沉重,会影响你的 Lighthouse 分数。这里讲述轻量级追踪器有何不同——以及为何这对真实用户很重要。

Core Web Vitals 如今已成为排名信号。缓慢的分析脚本不再仅仅是不便——它直接打击你的 SEO,以及每位网速缓慢访客的体验。用一个会降低站点性能的脚本去衡量站点流量,这种讽刺是真实存在的。

传统分析脚本的代价

Google Analytics 4 的全局站点标签传输大小约为 45 KB。它在加载时会发起多次网络请求——到 collect.js、到测量协议,有时还到额外的功能脚本。在 4G 网络下的移动设备上,这意味着在页面可交互之前会出现明显的延迟。

影响以三种方式显现。首先,脚本请求本身会与你的内容竞争网络带宽。其次,任何同步执行都会阻塞主线程。第三,后续每个分析事件(会话开始、page_view、互动)都会触发额外的出站请求。

轻量级追踪器如何改变这场博弈

Monoid 的追踪器经过压缩和 gzip 后不到 2 KB。它使用简单的 async 属性加载,这意味着浏览器会在后台下载它,而不会阻塞 HTML 解析或渲染。Largest Contentful Paint 不受影响,因为该脚本从不位于关键渲染路径上。

当 pageview 触发时,追踪器向收集端点发送一次 POST:

fetch('/collect', {
  method: 'POST',
  keepalive: true,
  body: JSON.stringify({ site_id, path, referrer, ... })
})

keepalive: true 标志是关键细节。它告诉浏览器即使用户在请求完成前导航离开,也要保持请求存活——这与 navigator.sendBeacon API 使用的机制相同,但完整支持 JSON。你可以获得可靠的投递而不会阻塞导航。

三项 Core Web Vitals,逐一拆解

Largest Contentful Paint(LCP) 测量主要内容何时可见。一个不在关键路径上的 async 脚本完全不会延迟 LCP。追踪器没有 DOM 操作,也不加载任何图片。

Interaction to Next Paint(INP) 测量对用户输入的响应能力。追踪器的事件监听器是只读且轻量的——单一的 popstate 监听器用于 SPA 导航。没有长任务,没有布局抖动。

Cumulative Layout Shift(CLS) 测量意外的布局移动。追踪器不向 DOM 添加任何元素,因此对布局偏移的贡献为零。

运行 Lighthouse 审计

如果你想量化差异,可以在添加追踪器前后对页面运行 Lighthouse 审计。性能分数应该不变。追踪器会在网络瀑布流中显示为延迟加载的 async 脚本——小巧、快速,且位于关键路径之外。

将其与 GA4 审计相比较,Lighthouse 通常会在"减少第三方代码的影响"中标记该分析标签,并报告其对线程阻塞时间的贡献。

性能也是一个隐私论据

脚本体积与隐私之间存在一种值得直白说明的联系:沉重的分析脚本之所以沉重,是因为它们做得更多。更多追踪、更多设备识别、更多行为画像。这个 2 KB 的追踪器之所以小,是因为它只收集所需的内容——每次 pageview 仅几个非个人信号。粗略的浏览器系列和设备类型在服务器端从请求 User-Agent 推导得出,而完整的 User-Agent 字符串、浏览器版本、cookie、持久标识符和设备指纹从不存储。

选择轻量级分析不是性能与洞察之间的权衡。它是认识到传统工具中的额外重量来自于你可能根本不需要的数据收集。