前端性能指标有哪些，如何解决
维护说明
- 这页统一引用 性能公共素材 的性能指标口径。
- 如果要改指标讲法，优先改素材页。
一句话先定性
如果面试官问性能指标，我不会背一串缩写，而会按“加载速度、交互响应、页面稳定性”三类来讲，再对应说我是怎么优化的。
30 秒版本
我一般会先讲 Web Vitals 这一套：
TTFB看后端和网络首包速度，FCP看首次内容出现，LCP看首屏核心内容加载，INP看交互响应，CLS看页面稳定性。解决思路也按指标拆：TTFB偏后端和缓存，FCP/LCP偏资源体积、懒加载和渲染链路，INP偏主线程阻塞和长任务拆分，CLS偏图片尺寸预留、骨架屏和异步内容插入方式。这样回答会比只背指标更完整。
1 分钟版本
我会先把性能指标分三类。第一类是加载速度，比如
TTFB、FCP、LCP；第二类是交互体验，比如INP；第三类是稳定性，比如CLS。这样讲比单纯背概念更像真实项目里的分析方式。具体来说，
TTFB主要反映服务端响应和缓存命中；FCP表示页面第一次有内容；LCP更关注首屏最重要内容什么时候出来；INP看用户操作后页面多久有真实反馈；CLS看页面有没有明显抖动。如果讲解决思路，我会按问题来源说。加载慢就看资源体积、接口耗时、缓存和关键路径资源；交互卡就看主线程长任务、重复渲染、重计算；页面抖就看图片和广告位是否预留尺寸、异步内容插入方式是否稳定。也就是说，我不会把性能优化讲成一个大口号，而会讲成指标和治理动作之间的一一对应。
2 到 3 分钟版本
如果面试官问“有哪些性能指标，是怎么解决的”，我一般不会从 API 开始讲，而会先讲一套分析框架。对我来说，前端性能指标可以分成三组：第一组是加载性能，第二组是交互性能，第三组是视觉稳定性。这样讲比较接近真实排查路径。
加载性能里，我最常讲的是
TTFB、FCP和LCP。TTFB代表首字节时间，偏服务端响应、网络链路和缓存命中；FCP代表第一次内容绘制，说明用户什么时候看到页面开始有东西；LCP更关键，它看的是首屏最重要内容什么时候真正出来，通常比FCP更接近用户体感。如果这几个指标差，我会先拆原因。比如
TTFB高，我会优先看服务端接口耗时、CDN、缓存策略、SSR 或网关链路；如果FCP/LCP高，我会看首屏资源是不是太大，JS 包是不是过重，关键图片是不是没有压缩，字体是不是阻塞渲染，首屏组件是不是做了太多同步计算。对应动作一般包括代码拆包、懒加载、资源压缩、图片格式优化、缓存、预加载关键资源，以及减少首屏不必要的同步工作。第二组是交互性能，我一般会重点讲
INP。以前很多人会讲FID，但现在更建议讲INP，因为它更能反映一次完整交互从输入到页面响应的真实体验。如果INP差，通常说明主线程太忙，比如长任务太多、React 重渲染太频繁、一次输入触发了太重的计算，或者事件回调里做了太多同步逻辑。这个时候我会从减少长任务、拆分计算、延迟非关键逻辑、避免不必要渲染、虚拟列表和 memo 化这些方向去优化。第三组是视觉稳定性，也就是
CLS。这个指标经常被忽略，但用户体感很明显。比如图片没预留尺寸、广告位后插入、骨架屏和真实内容高度差很多、异步模块把页面撑开，这些都会导致页面抖动。如果CLS高，我一般会先做尺寸预留、固定容器占位、优化异步内容插入策略，并让骨架屏尽量接近最终布局。如果让我再收一下，我会说性能指标不是背概念，而是看你能不能把指标和优化动作对应起来。比如
TTFB对服务端和缓存，LCP对首屏资源和渲染链路，INP对主线程阻塞，CLS对布局稳定性。真正有经验的回答，不是知道多少缩写，而是知道每个指标差的时候应该先查哪里。
如果面试官追问“为什么你更强调 LCP 而不是 FCP”
因为
FCP只能说明页面第一次开始有内容，不代表用户真正看到核心内容了。LCP更接近用户对首屏加载的真实体感，所以在首屏体验里通常更有参考价值。
如果面试官追问“INP 差一般怎么排查”
我会先怀疑主线程是不是被长任务占住了，然后看输入事件后有没有大计算、重复渲染或者同步阻塞。前端层面通常就是拆长任务、减少不必要渲染、把非关键逻辑延后执行。
如果面试官追问“CLS 为什么经常高”
最常见就是没预留尺寸。比如图片、广告位、异步模块、骨架屏和真实内容差异太大，这些都会让页面后续把布局顶来顶去。所以 CLS 很多时候不是算法问题，而是布局治理问题。
最后一句收尾
所以如果面试里问性能指标，我会按
TTFB/FCP/LCP讲加载，按INP讲交互，按CLS讲稳定性，再把每个指标对应到具体优化动作上，这样会比背术语更像真实项目经验。
相关追问
- React 项目性能优化怎么讲
- 性能优化如何结合真实项目经历用 STAR 讲
- 线上页面突然变卡你怎么排查
- 性能优化结果怎么量化和讲业务价值
- 性能问题高频追问怎么答
- 首屏优化怎么讲
- 交互卡顿怎么讲
- CLS 抖动怎么讲