Core/Dash 诊断

我们优化了基础设施，让你不用再花冤枉钱。我们提供高质量的 Core Web Vitals 监控，没有营销溢价！

免费试用

Trusted by market leaders · Client results

CoreDash 诊断：根因引擎

真实用户监控为你提供生命体征指标。你的 LCP 是 3.2 秒。你的 CLS 是 0.25。你的 INP 不达标。这正是 RUM 的设计初衷。它展示关键指标。它告诉你性能已经降级，以及哪里需要关注。这是修复 Core Web Vitals 的第一步，也是至关重要的一步。

但一旦有了数据，真正的活儿才刚刚开始。LCP 不达标可能是因为服务器慢、图片过大、存在 render blocking 脚本，或者三者都有。RUM 给你看症状。接下来的下一步就是诊断。

CoreDash 诊断是把指标转化为解决方案的智能层。 它通过自动化的性能取证扩展你的 RUM 数据，从浏览器中捕获详细的执行剖析，从而找出确切的瓶颈，并生成专门针对你的 CMS 定制的解决方案！。

从测量到根因

你有了仪表盘。LCP 是 3.2 秒。你知道问题出在哪里。现你需要知道原因。是 Hero 图片的问题？第三方脚本？还是服务器响应时间？你可以花几个小时分析瀑布图、剖析 main thread、测试各种假设。或者，你也可以让诊断引擎帮你搞定。

CoreDash 诊断迈出了合乎逻辑的下一步。它不只测量性能，它还能对故障进行逆向剖析。

LCP 诊断：四个阶段，一个答案

我们将 Largest Contentful Paint 分解为四个组成阶段：TTFB、Load Delay、Load Duration 和 Render Delay。当某个阶段不达标时，我们不仅会指出，还会进行解释。

服务商归因：我们不只报告“脚本执行时间长”。我们报告的是 HubSpot 的追踪脚本阻碍了绘制 150 毫秒，或者 Google Tag Manager 延迟了渲染 300 毫秒。让你看清服务商、性能代价和影响。
反模式检测：我们扫描 14 种特定的架构错误：对 LCP 图片进行 lazy loading、将其隐藏在 CSS 背景中，或者从没有优化的 CDN 中加载。我们能捕捉到常规审计遗漏的错误。
代码级修复： 我们直接生成修复代码。如果你的 LCP 图片没有优先级提示，我们会为你写好 <link rel="preload"> 标签。如果某个脚本阻塞了渲染，我们会告诉你应该在何处添加 defer。修复方案已准备就绪，复制粘贴即可。

CLS 诊断：捕捉幽灵 Bug

布局偏移是最难重现的 Bug。某次连接中字体加载慢了，或者移动端广告渲染慢了，偏移发生一次后，你就再也看不到了。

CoreDash 诊断会捕捉每一帧。我们记录偏移、识别元素并追溯根因。

目标元素：我们确切地告诉你哪个 DOM 节点发生了移动。不是“页眉里的某个地方”，而是特定的 <div> 带有特定的 class。
触发原因：我们告诉你它移动的原因。例如 Web 字体在没有 fallback 声明的情况下进行了切换，横幅广告在没有预留空间的情况下插入，或者图片加载时没有指定尺寸。
解决方案： 我们来写 CSS。给图片加上 aspect-ratio: 16/9。给 font face 设置 font-display: swap。为广告容器预留 min-height: 250px。布局偏移就再也不会发生了。

INP 诊断：找出卡顿

Interaction to Next Paint 衡量的是页面的响应速度。如果它不达标，界面就会卡死。用户点击了按钮，却毫无反应。

RUM 数据告诉你“INP 较差”以及访客在页面的哪些地方进行了交互。我们会明确告诉你哪个函数阻塞了 main thread，以及如何修复它！

锁定交互：我们能够识别确切的输入事件，如按钮点击、表单提交、按键操作，从而查明是哪次交互失败了。
剖析处理函数：我们测量你的事件监听器。我们可以向你展示你自己代码的执行时间，精确到具体的函数。如果你的点击处理函数执行了 200 毫秒的同步操作，我们会把这 200 毫秒指给你看。
检测干扰：有时你的代码很快，但浏览器正忙于处理其他事情。比如第三方分析库正在处理数据，或者追踪像素正在发起网络请求。我们会标记出那些抢占用户交互 CPU 周期的后台任务。

你不用再盲目优化。你要做的是优化那个真正导致卡顿的函数。