理解Web Vitals：衡量网站速度的新标准

要维持视觉稳定性，应在CSS中为 图像、视频、广告位 等元素指定明确的高度值，避免内容加载后突然撑大页面

字体加载也可能导致重排，建议设置 font-display: swap 并提前预加💎载主要字体文件

理解Web Vitals：衡量网站速度的新标准

维度 建议工具 优化优先级 LCP PageSpeed Insights、Chrome DevTools 高（直接影响首屏感知） FID Lighthouse实验室数据、浏览器性能面板 中（影响交互满意度） CLS CSS容器检查、布局偏移分析插件 中（影响内容可读性） 在实际操作中，可以先抓取网站当前的核心Web Vitals数据，然后针对得分最差的指标先行优化

核心性能指标主要包含三个方面： LCP（最大内容绘制） 、 FID（首次输入延迟） 和 CLS（累计布局偏移）

理解Web Vitals：衡量网站速度的新标准

控制CLS：减少页面意外跳动 累计布局偏移常被忽视，却直接影响阅读体验