核心网页指标
Core Web Vitals
中级网页核心网页指标(Core Web Vitals)是一组衡量网页加载、交互响应和视觉稳定性的用户体验指标。它帮你发现页面看似已经打开,却还要等主要内容、点击后反应迟缓或布局突然跳动的问题。
你可能会说:「我想让网站打开后主要内容快点出现,点按钮反应快,页面也别突然乱跳。」
读之前建议先了解
动手看看商品页的三种卡顿
松果杂货铺
春日上新
手冲咖啡套装
陶瓷滤杯 · 分享壶
¥ 129
加入购物车
LCP · 主要内容
3.8 秒
INP · 交互响应
80 毫秒
CLS · 布局稳定
0.01
体验状态
切换体验状态,再点「重播」看商品页;也可以悬停、按住或用 Tab 聚焦购物车按钮。下方三个数字分别关注内容出现、交互响应和布局稳定。
文字和价格已经能看了,主图却还在加载。LCP 关注的是主要内容何时出现,不等于页面什么时候开始显示。
要点核心网页指标分别看什么?
- 1
最大内容绘制看主体何时出现
LCP 关注视口内最大的图片或文字块何时完成呈现。比如商品详情页先露出导航,但商品主图很久才出现,用户仍会觉得页面没加载好。
- 2
交互到下一次绘制看响应快慢
INP 关注用户点击、触摸或按键后,页面多久能显示相应反馈。如果筛选按钮点下去却迟迟没有变化,就可以沿着这项指标排查主线程是否被任务占住。
- 3
累积布局偏移看画面是否乱跳
CLS 衡量页面元素意外移动的程度。比如用户正要点搜索结果,顶部广告加载后把列表推下去,就会造成布局偏移;提前给广告位留空间通常能改善它。
容易混淆的地方
核心网页指标衡量的是网页体验,不等于网站的全部性能。它不能单独说明接口是否稳定、服务器花了多少钱,也不能代替完整的用户调研。浏览器开发者工具中的单次测试适合定位问题;判断真实用户是否普遍遇到问题,还要结合实际访问数据,并留意设备和网络差异。
什么时候用
适合用
- 你上线了面向用户的网站,想判断首页主图加载慢、按钮反应迟缓或内容跳动是否影响真实访问体验。
- 你让 AI Agent 优化商品页,希望有明确的网页体验指标来比较改动前后,而不只是听它说“已经提速”。
- 你准备排查移动端落地页的流失问题,想先确认加载、交互和布局稳定性有没有明显短板。
不适合用
- 你做的是原生手机 App,不是浏览器网页;可以改用对应平台的启动耗时、卡顿和界面稳定性指标。
- 你只想评估一个后台 API 的处理能力,没有网页交互;用请求延迟、错误率和负载测试更直接。
- 你在核算 AI 功能的模型调用费用;应查看 Token 用量和账单,核心网页指标回答不了成本问题。
练一练选一个答案,看看解释
一个商品页的导航很快出现,但主图迟迟不显示;点规格后页面卡一下,促销横幅加载时还把购买按钮挤下去。你会怎样让 AI Agent 排查?
让 AI 帮你做复制给 AI Agent 直接用
请检查这个商品页的核心网页指标:分别定位影响 LCP、INP 和 CLS 的页面元素或任务,区分真实用户数据与本地测试结果。先说明瓶颈和证据,再提出改动,并给出改动前后的验证方法。