要测试页面在手机上的速度,把网址输入 PageSpeed Insights,先看顶部的真实用户数据,再看下方的 Lighthouse 实验室结果。真实用户数据告诉你手机访客的体验是否够快,实验室数据帮你找出不够快的原因。如果在至少 75% 的访问中,主要内容在 2.5 秒内显示、交互在 200 毫秒内响应、布局偏移分数不超过 0.1,页面就通过了移动端的 Core Web Vitals。
真实用户数据和实验室数据是两回事
关于速度分数的大部分困惑,都来自把两者混为一谈。
**真实用户数据(现场数据)**通过 Chrome 用户体验报告(CrUX)收集,来自过去 28 天访问过你页面的真实 Chrome 用户。它反映的是真实的手机、网络和使用方式,只有流量足够的页面和网站才有这类数据。
实验室数据来自一次模拟测试,通常是 Lighthouse 在网络受限的模拟中端手机上加载页面。它可重复、细节丰富,适合用来排查问题。它的分数(0–100)并不是 Google 用于排名的依据,而且每次运行都会变化。
两者结论不一致时,“好不好”看真实用户数据,“该改什么”看实验室数据。
移动端 Core Web Vitals 阈值
| 指标 | 衡量内容 | 良好 | 需要改进 | 较差 |
|---|---|---|---|---|
| Largest Contentful Paint(LCP) | 主要内容何时出现 | ≤ 2.5 秒 | 2.5–4 秒 | > 4 秒 |
| Interaction to Next Paint(INP) | 页面对点按和点击的响应速度 | ≤ 200 毫秒 | 200–500 毫秒 | > 500 毫秒 |
| Cumulative Layout Shift(CLS) | 加载过程中布局跳动的程度 | ≤ 0.1 | 0.1–0.25 | > 0.25 |
每项指标都按访问的第 75 百分位评估,移动端和桌面端分开计算。移动端的数值几乎总是更差,因为手机的处理器更慢、网络更不稳定。这些阈值由 Google 在 web.dev 上定义。
好用的免费移动端网站测速工具
| 工具 | 数据类型 | 适用场景 |
|---|---|---|
| PageSpeed Insights | 真实用户数据(如有)+ 实验室数据 | 检查任何公开网址的第一步 |
| Search Console 的 Core Web Vitals 报告 | 真实用户数据 | 找出全站中成组的慢页面 |
| Chrome DevTools 中的 Lighthouse | 实验室数据 | 测试需要登录的页面或 localhost,详细诊断 |
| DevTools 的 Performance 面板 | 实验室数据,以及你自己操作时的实时指标 | 找到造成延迟的具体脚本或元素 |
| WebPageTest | 在真实设备和不同地点进行的实验室测试 | 加载胶片图、瀑布图以及从其他国家发起的测试 |
Lighthouse 的具体操作步骤见 Lighthouse 移动端审核指南。
如何做一次有用的移动端测速
- 测对页面。 选择访问量最高的落地页,而不只是首页。
- 先看真实用户数据。 如果 PageSpeed Insights 显示“无数据”,就看整个来源(origin)的数据或 Search Console。
- 实验室测试运行三次,取中位数。单次结果波动很大。
- 本地测试时限速。 在 DevTools 中录制 Performance 之前,把 CPU 降速设为 4 倍,网络设为 Fast 4G 或 Slow 4G。你的电脑比大多数手机快得多。
- 观察页面的加载过程。 速度问题往往肉眼可见:主图很晚才出现、Cookie 横幅把内容往下推。这时手机视图很有帮助。用 DevTools 的设备模式或 Mobile View Extension,可以用移动端 user agent 观察手机尺寸页面的加载过程。如果服务器给手机返回不同的资源,这一点尤其重要。
通常能改善数值的优化方法
LCP 慢
- 用现代格式和手机尺寸提供主图,并加上
srcset和sizes。 - 不要对主图使用懒加载,给它加上
fetchpriority="high"。 - 通过缓存或 CDN 缩短服务器响应时间。
- 把阻塞渲染的 CSS 和 JavaScript 移出
<head>,或延后加载。
INP 慢
- 拆分长的 JavaScript 任务,超过 50 毫秒的任务都会阻塞点按。
- 延迟加载或移除每个页面都运行的第三方脚本(客服聊天组件、标签管理器、A/B 测试)。
- 避免在点击和输入处理函数里做重活:先给出反馈,再执行任务。
CLS 高
- 为图片、视频和嵌入内容设置
width和height(或aspect-ratio)。 - 为广告和横幅预留空间。
- 用
font-display: swap加载网页字体,并选择度量相近的后备字体。
移动端速度到底有多重要?
Google 把 Core Web Vitals 作为页面体验信号的一部分,但对排名来说,相关性和内容质量更重要。更值得关心速度的理由是访客的行为:在手机上,慢或者跳动的页面会在用户读到任何内容之前就把人流失掉。把 Core Web Vitals 当作质量底线,而不是要追逐的分数。
上线前的其他检查项见移动端网页测试清单,更全面的移动端优化见如何让网站适配手机。
常见问题
移动端速度分数多少算好?
Lighthouse 分数只是实验室估算。更重要的是在真实用户数据中通过 Core Web Vitals:至少 75% 的访问 LCP 低于 2.5 秒、INP 低于 200 毫秒、CLS 低于 0.1。
为什么移动端分数比桌面端低很多?
移动端的实验室测试模拟的是更慢的处理器和网络。在这种条件下,臃肿的 JavaScript 和大图片的影响要大得多。
能在 localhost 上测试移动端速度吗?
可以,用 Chrome DevTools 中的 Lighthouse 或 Performance 面板。PageSpeed Insights 只能测试公开网址。