核心 Web 指标 (LCP FID CLS)
LCP: Largest Contentful Paint 最大内容绘制
测量加载性能,可视区域内最大图像或文本块完成渲染的相对时间 < 2.5s
LCP 主要受四个因素影响:
- 缓慢的服务器响应速度
- JavaScript 和 CSS 渲染阻塞
- 资源加载时间
- 客户端渲染
FID:First Input Delay 首次输入延迟
测量交互性,用户第一次与页面交互到浏览器对交互作出响应,并实际能够开始处理事件处理程序所经过的时间 < 100ms
CLS:Cumulative Layout Shift 累积布局偏移
测量视觉稳定性,整个页面生命周期内发生的所有意外布局偏移中最大一连串的布局偏移分数 < 0.1
布局偏移分数 = 影响分数 * 距离分数
[
影响分数:不稳定元素位移前后的可见区域集合 占 总可视区域 的比例
距离分数:不稳定元素位移距离 占 总可视区域高度 的比例
]
FCP:First Contentful Paint 首次内容绘制
测量页面从开始加载到页面上任何内容部分完成渲染的时间 < 1.8s
TTI:Time to Interactive 可交互时间
测量页面从开始加载到主要子资源完成渲染,并能够快速、可靠地响应用户输入所需的时间 < 5s
TBT:Total Blocking Time 总阻塞时间
测量 FCP 与 TTI 之间的总时间 < 300ms