免费性能工具

网站测速

我们以中端手机在慢速 4G 网络下加载您的页面,测量主要内容出现的速度和页面跳动的程度,并显示导致页面臃肿的原因。如果 Google 有您网站的真实用户数据,您也能一并看到。

免费。通常不到一分钟即可完成。

此工具检查什么

  • 慢速 4G 网络下的手机

    页面在 Chromium 中以 Moto G Power 级别的手机(412 × 823)加载,延迟 150 ms,下行约 1.6 Mbps、上行约 750 Kbps,CPU 降速 4 倍。这是 Lighthouse 移动端测试所用的配置。

  • 最大内容绘制(LCP)

    首屏中最大的图片或文字块完成渲染的时间,以及它是哪个元素。

  • 累积布局偏移(CLS)

    页面加载期间,可见内容发生意外移动的程度。

  • 总阻塞时间(TBT)

    脚本让浏览器忙到无法响应点按的时长:把每个长任务中超过 50 ms 的部分加起来。它是 Interaction to Next Paint(INP)在实验室测试中的替代指标。

  • 页面下载了什么

    总字节数和请求数,按图片、脚本、CSS 和字体分类,以及来自第三方的比例。

  • 过大的图片和阻塞渲染的文件

    超过 150 KB 或远宽于其显示区域的图片,以及阻碍首次渲染的 CSS 和脚本文件。

  • 来自 Chrome 的真实用户数据

    Google Chrome 用户体验报告(Chrome UX Report)中您的源在手机上第 75 百分位的 LCP、INP 和 CLS 数据,前提是 Google 掌握该网站足够的流量。

它无法检查什么

  • 无法在每次运行时给出相同的数字。实验室结果会随网络、服务器负载和第三方脚本而变化,所以请比较趋势,而不是单次结果。
  • 无法与 PageSpeed Insights 完全一致。两者使用相似的手机配置,但运行在不同的机器和网络上。
  • 无法在实验室中测量 INP。INP 需要真实的交互,因此实验室测试显示 TBT,实测数据(如有)则显示 INP。
  • 无法为每个网站提供实测数据。Chrome UX Report 涵盖最近 28 天,且只包含 Chrome 流量足够的源。
  • 无法测试您输入的页面以外的页面。付费的性能修复报告会测试 3 个关键页面,并对原因进行排序、给出修复方案。

为什么重要

在办公室 Wi-Fi 和高速笔记本电脑上感觉秒开的页面,在信号较弱的中端手机上可能要好几秒。本测试模拟的正是这种情况,因为过大的图片和脚本在这里造成的损害最大。

Core Web Vitals(核心网页指标)是 Google 衡量这种体验的指标:加载(LCP)、响应速度(INP)和视觉稳定性(CLS)。Google 在排名中会使用它们,但也表示良好的页面体验并不能压过内容的相关性。它们对用户的影响更大:缓慢或跳动的页面,会在访客读到任何内容之前就把他们流失掉。

原因通常很具体:一张几兆字节、未经压缩的首屏大图,一个在内容之前加载的在线聊天插件,一个让文字暂时隐藏的网页字体,或者一个在页面出现后插到上方的横幅。本测试会指出 LCP 元素和最大的文件,让您看清是哪种情况。

如何解读结果

最大内容绘制(LCP)
低于 2.5 s 为良好,高于 4 s 为较差。如果 LCP 元素是图片,最关键的是它的大小和加载优先级;如果是文字,请检查网页字体和阻塞渲染的 CSS。
累积布局偏移(CLS)
低于 0.1 为良好,高于 0.25 为较差。这是一个没有单位的分数,综合了屏幕上发生移动的范围和移动的距离。
总阻塞时间(TBT)
低于 200 ms 为良好,高于 600 ms 为较差。TBT 偏高,预示着真实用户点按时页面响应会变慢。
字节数和请求数
没有官方上限;请看哪种类型占比最大。图片通常占比最大,而第三方占比高则说明问题出在应用、标签代码和小组件上。
过大的图片
每张超过 150 KB,或下载尺寸远宽于显示尺寸的图片,并附文件大小和尺寸。
阻塞渲染的文件
浏览器必须先下载完才能显示任何内容的 CSS 和同步脚本。
实测数据(第 75 百分位)
最近 28 天内手机上真实 Chrome 用户的数据。第 75 百分位意味着每四次页面加载中有三次至少达到这个速度。INP 低于 200 ms 为良好,高于 500 ms 为较差。
没有实测数据
Google 没有足够的该源 Chrome 流量。这并不说明您的网站速度如何;请以实验室结果为准。

如何修复最常见的问题

  • LCP 图片加载缓慢

    使用 srcset,以实际显示尺寸提供 WebP 或 AVIF 格式的首屏大图。不要对它使用延迟加载,添加 fetchpriority="high",并将它作为 img 元素直接写在 HTML 中,而不是通过脚本或 CSS 背景加载。

  • 加载时内容跳动

    为图片、视频和嵌入内容设置 width 和 height 属性或 CSS aspect-ratio。为横幅、Cookie 通知和广告预留空间,或将它们显示为不会把内容往下推的浮层。对于网页字体,使用 font-display: optional 或尺寸匹配的备用字体。

  • 总阻塞时间过高

    首先移除不再使用的应用、标签和插件;停用后,它们的脚本往往仍会保留。用 defer 或在页面可交互后再加载在线聊天、评价和统计分析脚本。在 Shopify 上,请检查“在线商店 › 模板 › 自定义 › 应用嵌入”。

  • 阻塞渲染的 CSS 和脚本

    为无需在首次绘制前运行的脚本添加 defer,将首屏所需的少量 CSS 内联,并移除页面未使用功能的样式表。

  • 图片过大

    上传前先调整图片尺寸(全宽横幅约 2000 px 宽就足够了)并进行压缩。只要主题请求,Shopify 和 WordPress 都能自动提供较小的版本,所以请确认您的主题使用了响应式图片尺寸。

关于此工具的问题

为什么我的结果与 PageSpeed Insights 不同?

实验室测试取决于机器、网络和测试时刻。PageSpeed Insights 在 Google 的服务器上运行 Lighthouse 并模拟慢速连接,而我们是在真实浏览器中施加限速。结果的范围应当相近,但数字不会完全相同。

LCP 多少算好?

根据 web.dev 的标准,至少 75% 的页面加载应在 2.5 秒或以内。超过 4 秒为较差。

为什么我的网站没有真实用户数据?

Chrome UX Report 只收录可公开发现、且有足够多分享使用情况统计信息的 Chrome 用户访问的源。许多小型网站达不到这个访问量;实验室测试仍会显示需要修复的地方。

为什么用慢速手机而不是桌面电脑测试?

因为问题会最先在手机上暴露。高速笔记本电脑会掩盖那些在中端手机上要多花好几秒的大图片和脚本,而且 Lighthouse 的移动端测试也使用同样的手机配置。

首次输入延迟(First Input Delay)怎么了?

2024 年 3 月,Interaction to Next Paint(INP)取代首次输入延迟,成为 Core Web Vitals 指标之一。INP 关注整个访问过程中所有交互的延迟,而不仅仅是第一次交互。

性能修复报告($55,一次性)以完整的免费扫描为起点,增加更多页面、每项发现需要做的修改、PDF 以及验证修复的复测。

了解性能修复报告