Skip to content

前端性能指标:LCP、CLS、INP、TTFB 与用户感知

主题边界

  • 性能指标是把复杂的加载和交互过程映射成可观测数字,但不同指标关注的阶段不同。
  • 讨论性能优化前,必须先知道自己在优化哪段体验。

机制与流程

  • TTFB 反映请求到首字节到达的时间,更多受网络、CDN、后端和缓存影响。
  • LCP 衡量主要内容元素何时渲染出来;CLS 衡量布局稳定性;INP 衡量一次交互从输入到下一帧反馈的延迟。
  • 这些指标都依赖浏览器真实会话采样,实验室数据与线上 RUM 数据可能差异很大。

关键差异

  • Lighthouse 给的是可控环境下的实验室指标,RUM 反映真实用户环境。
  • FCP 很适合看最早可见内容,但不代表用户认为页面“已经有用了”。

边界条件

  • 单看平均值会掩盖长尾用户问题,性能治理更应该关注分位数。
  • 盯着单指标优化容易把问题从一个阶段转移到另一个阶段,例如压低 LCP 却引入更高 INP。

工程落点

  • 性能指标必须和页面类型、业务目标和错误率一起看,才能避免为分数优化而不是为体验优化。
  • 指标接入后要能追到页面、版本、设备、网络条件与具体资源,才有治理价值。

相关主题