CLS 抖动怎么讲

一句话先定性

CLS 本质上不是“页面抖了一下”，而是布局稳定性出了问题，用户会直接觉得页面不可靠。

30 秒版本

如果面试官问 CLS，我一般会说它看的是页面在加载和交互过程中有没有明显布局偏移。最常见的原因就是图片、广告位、异步模块没预留尺寸，或者骨架屏和真实内容差异太大。解决思路通常就是尺寸预留、固定占位、优化异步内容插入方式，让布局尽量在一开始就稳定下来。

小抄

• 优先指标：CLS
• 先查什么：图片尺寸、广告位占位、骨架屏高度、异步模块插入、字体切换
• 常见动作：宽高预留、固定容器占位、骨架屏贴近最终布局、避免后插入把页面顶开
• 面试要点：强调这是布局治理问题，不只是某个动画抖了一下

高频追问

为什么 CLS 经常容易高

因为很多团队会先把内容占位这件事忽略掉，等资源回来再把页面撑开。比如图片没写尺寸、广告位后插入、骨架屏高度不准，这些都很容易把布局顶来顶去。

CLS 为什么不能简单理解成动画问题

因为它关注的是对用户体验有影响的布局偏移，很多时候不是动画本身，而是内容加载和插入方式导致页面结构变化。

最后一句收尾

所以 CLS 不是一个小细节指标，它反映的是页面是不是稳定、是不是值得信任，这也是为什么我会把它当成布局治理问题来看。