audit-speed

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

Audit Speed

速度审计

Deep Core Web Vitals audit with root-cause analysis trees and resource optimization recommendations.

提供深度Core Web Vitals审计服务，包含根因分析树与资源优化建议。

Core Web Vitals Thresholds

Core Web Vitals阈值

Metric	Good	Needs Improvement	Poor
LCP (Largest Contentful Paint)	< 2.5s	2.5s - 4.0s	> 4.0s
CLS (Cumulative Layout Shift)	< 0.1	0.1 - 0.25	> 0.25
INP (Interaction to Next Paint)	< 200ms	200ms - 500ms	> 500ms
FCP (First Contentful Paint)	< 1.8s	1.8s - 3.0s	> 3.0s
TTFB (Time to First Byte)	< 800ms	800ms - 1800ms	> 1800ms

指标	良好	待优化	较差
LCP (Largest Contentful Paint)	< 2.5s	2.5s - 4.0s	> 4.0s
CLS (Cumulative Layout Shift)	< 0.1	0.1 - 0.25	> 0.25
INP (Interaction to Next Paint)	< 200ms	200ms - 500ms	> 500ms
FCP (First Contentful Paint)	< 1.8s	1.8s - 3.0s	> 3.0s
TTFB (Time to First Byte)	< 800ms	800ms - 1800ms	> 1800ms

Before You Start

开始之前

Gather this context:

Which pages? Homepage, key landing pages, or specific slow pages.
Current scores. If the user has Lighthouse or PageSpeed Insights data, start there.
Tech stack. CMS, framework, hosting — this determines which optimizations are available.
Known constraints. Third-party scripts they can't remove, design requirements that limit optimization.

If no data is available, suggest running Google PageSpeed Insights on the key URLs.

请收集以下上下文信息：

要审计哪些页面？ 首页、核心落地页，或是特定的加载缓慢页面。
当前得分。 如果用户有Lighthouse或PageSpeed Insights数据，可直接以此为分析起点。
技术栈。 CMS、前端框架、托管服务——这决定了可采用的优化方案范围。
已知限制。 无法移除的第三方脚本、限制优化空间的设计要求。

如果没有可用数据，建议对核心URL运行Google PageSpeed Insights进行检测。

LCP Root-Cause Tree

LCP根因分析树

LCP measures when the largest visible element finishes rendering. Diagnose:

Is TTFB slow (> 800ms)?

→ Server response time issue
Check: hosting quality, CDN configuration, database queries, server-side rendering time
Fix: upgrade hosting, add CDN, optimize server-side code, enable caching

Is the LCP element an image?

→ Image optimization issue
Check: image format (use WebP/AVIF), image size (serve responsive sizes), lazy loading on LCP image (should NOT be lazy loaded)
Fix: convert to modern formats, add
```
width
```
/
```
height
```
attributes, use
```
fetchpriority="high"
```
on LCP image, preload the LCP image

Is the LCP element text?

→ Font loading issue
Check: custom fonts blocking render, font file size, font-display strategy
Fix: use
```
font-display: swap
```
or
```
optional
```
, preload critical fonts, subset fonts to used characters

Is render-blocking CSS/JS delaying the LCP?

Check: large CSS files in
```
<head>
```
, synchronous JS before content
Fix: inline critical CSS, defer non-critical CSS, async/defer JS

LCP用于衡量页面最大可见元素完成渲染的时间。诊断思路：

TTFB是否过慢(> 800ms)？

→ 服务器响应时间问题
检查项：托管服务质量、CDN配置、数据库查询、服务端渲染耗时
修复方案：升级托管服务、接入CDN、优化服务端代码、开启缓存

LCP元素是否为图片？

→ 图片优化问题
检查项：图片格式（推荐使用WebP/AVIF）、图片尺寸（应提供响应式尺寸）、LCP图片是否设置懒加载（LCP图片不应该开启懒加载）
修复方案：转换为现代图片格式、添加
```
width
```
/
```
height
```
属性、为LCP图片设置
```
fetchpriority="high"
```
、预加载LCP图片

LCP元素是否为文本？

→ 字体加载问题
检查项：自定义字体是否阻塞渲染、字体文件体积、font-display策略
修复方案：使用
```
font-display: swap
```
或
```
optional
```
、预加载关键字体、裁剪字体仅保留用到的字符集

渲染阻塞的CSS/JS是否延迟了LCP？

检查项：
```
<head>
```
中存在大体积CSS文件、内容加载前的同步JS
修复方案：内联关键CSS、延迟加载非关键CSS、为JS设置async/defer属性

CLS Root-Cause Tree

CLS根因分析树

CLS measures unexpected layout shifts. Diagnose:

Do images/videos lack dimensions?

→ Browser can't reserve space before loading
Fix: add
```
width
```
and
```
height
```
attributes to all
```
<img>
```
and
```
<video>
```
elements, use CSS
```
aspect-ratio
```

Do ads or embeds inject content?

→ Dynamic content pushing existing content down
Fix: reserve space for ad slots with min-height, use
```
contain-intrinsic-size
```
for lazy content

Do fonts cause text reflow?

→ FOUT (Flash of Unstyled Text) causes layout shift when custom font loads
Fix: use
```
font-display: optional
```
(no swap = no shift), or match fallback font metrics

Does dynamic content insert above the fold?

→ Banners, cookie notices, notifications pushing content
Fix: use overlays instead of inline insertions, or reserve space with fixed-height containers

CLS用于衡量非预期的布局偏移程度。诊断思路：

图片/视频是否缺少尺寸属性？

→ 浏览器无法在资源加载前预留空间
修复方案：为所有
```
<img>
```
和
```
<video>
```
元素添加
```
width
```
和
```
height
```
属性、使用CSS
```
aspect-ratio
```

广告或嵌入内容是否会动态注入内容？

→ 动态内容会将已有内容向下挤压
修复方案：为广告位设置min-height预留空间、对懒加载内容使用
```
contain-intrinsic-size
```

字体是否导致文本重排？

→ FOUT（无样式文本闪烁）会在自定义字体加载时造成布局偏移
修复方案：使用
```
font-display: optional
```
（无字体替换 = 无偏移），或匹配 fallback 字体的度量值

首屏上方是否插入了动态内容？

→ 横幅、Cookie提示、通知等内容会挤压原有内容
修复方案：使用浮层而非行内插入，或使用固定高度容器预留空间

INP Root-Cause Tree

INP根因分析树

INP measures responsiveness to user interactions. Diagnose:

Is the main thread blocked by long tasks?

Check: JavaScript execution time, third-party scripts, large DOM
Fix: break long tasks with
```
requestIdleCallback
```
or
```
setTimeout
```
, code-split heavy modules

Do event handlers do heavy synchronous work?

Check: click handlers that trigger large DOM updates, form validation on every keystroke
Fix: debounce inputs, use requestAnimationFrame for visual updates, offload work to web workers

Are third-party scripts competing for the main thread?

Check: analytics, chat widgets, A/B testing tools, social embeds
Fix: defer loading until after interaction, use
```
loading="lazy"
```
for embeds, consider removing low-value scripts

INP用于衡量页面对用户交互的响应速度。诊断思路：

主线程是否被长任务阻塞？

检查项：JavaScript执行耗时、第三方脚本、大体积DOM
修复方案：使用
```
requestIdleCallback
```
或
```
setTimeout
```
拆分长任务、对重模块进行代码分割

事件处理函数是否执行繁重的同步工作？

检查项：触发大规模DOM更新的点击处理函数、每次按键都触发的表单校验
修复方案：对输入事件做防抖处理、使用requestAnimationFrame处理视觉更新、将任务转移到web worker执行

第三方脚本是否抢占主线程资源？

检查项：统计分析工具、聊天组件、A/B测试工具、社交嵌入内容
修复方案：延迟到用户交互后再加载、为嵌入内容设置
```
loading="lazy"
```
、考虑移除低价值脚本

Resource Analysis

资源分析

Break down the total page weight:

Resource Type	Size	Assessment	Action
HTML	[x] KB	[ok/large]	Compress, reduce inline styles/scripts
CSS	[x] KB	[ok/large]	Remove unused CSS, minify, critical CSS extraction
JavaScript	[x] KB	[ok/large]	Code-split, tree-shake, defer non-critical
Images	[x] KB	[ok/large]	Modern formats, responsive sizes, lazy load below fold
Fonts	[x] KB	[ok/large]	Subset, limit families/weights, preload critical
Third-party	[x] KB	[ok/large]	Audit necessity, defer, self-host if possible

Benchmarks:

Total page weight under 1.5 MB is good
JavaScript under 300 KB (compressed) for most sites
CSS under 100 KB (compressed)
First-party fonts under 100 KB

拆分总页面体积构成：

资源类型	大小	评估	优化动作
HTML	[x] KB	[良好/体积过大]	压缩、减少内联样式/脚本
CSS	[x] KB	[良好/体积过大]	移除未使用CSS、压缩、提取关键CSS
JavaScript	[x] KB	[良好/体积过大]	代码分割、tree-shake、延迟加载非关键内容
图片	[x] KB	[良好/体积过大]	转换为现代格式、响应式尺寸、首屏外内容懒加载
字体	[x] KB	[良好/体积过大]	裁剪字符集、限制字体家族/字重、预加载关键字体
第三方资源	[x] KB	[良好/体积过大]	审计必要性、延迟加载、尽可能自托管

基准参考值：

总页面体积小于1.5 MB为优秀
大多数站点压缩后JavaScript体积应小于300 KB
压缩后CSS小于100 KB
第一方字体小于100 KB

Output Format

输出格式

Speed Audit: [URL or domain]

速度审计: [URL或域名]

Core Web Vitals

Metric	Value	Rating	Root Cause
LCP	[value]	Good / Needs Improvement / Poor	[identified cause]
CLS	[value]	...	...
INP	[value]	...	...
FCP	[value]	...	...
TTFB	[value]	...	...

Resource Breakdown [Table from Resource Analysis]

Priority Fixes

For each failing metric, ordered by impact:

[Metric]: [Root cause]
- Current: [value]
- Target: [threshold]
- Fix: [specific action]
- Estimated impact: [high/medium/low]
...

Quick Wins List optimizations that require minimal effort:

Add
```
width
```
/
```
height
```
to images
Set
```
fetchpriority="high"
```
on LCP image
Defer non-critical JavaScript
...

Pro Tip: Use the free CWV Impact Calculator to estimate the traffic impact of fixing Core Web Vitals, and the Critical CSS Generator to extract above-the-fold CSS. SEOJuice MCP users can run
/seojuice:page-audit [domain] [url]
for instant CWV scores, Lighthouse data, and resource breakdowns.

Core Web Vitals

指标	数值	评级	根因
LCP	[数值]	良好 / 待优化 / 较差	[识别到的问题原因]
CLS	[数值]	...	...
INP	[数值]	...	...
FCP	[数值]	...	...
TTFB	[数值]	...	...

资源构成拆分 [资源分析部分的表格]

优先级修复方案

按影响程度排序，对应每个不达标指标：

[指标]: [根因]
- 当前值: [数值]
- 目标值: [阈值]
- 修复方案: [具体操作]
- 预计影响: [高/中/低]
...

快速优化项 列出低投入高回报的优化措施：

为图片添加
```
width
```
/
```
height
```
属性
为LCP图片设置
```
fetchpriority="high"
```
延迟加载非关键JavaScript
...

专业提示： 使用免费的CWV影响计算器估算修复Core Web Vitals对流量的影响，使用关键CSS生成器提取首屏CSS。SEOJuice MCP用户可运行
/seojuice:page-audit [domain] [url]
即时获取CWV得分、Lighthouse数据和资源拆分报告。