求助：https://rentalinnovationz.com/ 网站CLS（累积布局偏移）成因排查

• 排查动态插入内容：广告、统计脚本、聊天插件这类第三方资源加载时，常无预警插入DOM且未预留空间，极易引发布局偏移。可临时禁用所有第三方脚本，观察CLS是否下降。
• 字体加载验证：自定义字体未配置font-display: swap，或 fallback 字体与自定义字体的行高、字重不匹配，字体加载完成后替换默认字体时会导致布局跳动。可强制使用系统字体测试，对比CLS变化。
• 追踪JS动态样式修改：页面加载后通过JS修改元素的margin、padding、position，或通过类名切换触发样式变更，都可能引发偏移。用Chrome DevTools的【Performance】面板录制加载流程，在【Layout Shift】事件中定位触发偏移的元素，进而找到对应的代码逻辑。
• 表单元素状态检查：首屏内的输入框获取焦点时边框变粗、下拉菜单展开等交互，若未提前预留空间也会导致偏移。可临时移除表单元素的交互样式测试。
• 视口单位动态计算排查：即便移除了101vh样式，其他元素若用vw/vh结合JS动态计算尺寸，在窗口缩放、滚动或移动端屏幕旋转时，可能重新计算尺寸引发偏移。可固定这类元素的尺寸做测试。
• 隐藏元素显示的影响：首屏内原本display: none的元素（如弹窗、提示）突然切换为显示状态，且未提前用占位容器预留空间，会导致布局挤压。可将display: none替换为visibility: hidden测试，或提前设置占位容器。
• CSS动画/过渡检查：使用width/height这类会触发重排的属性做动画，未添加will-change优化，也可能引发布局偏移。临时禁用所有动画，观察CLS是否改善。

内容的提问来源于stack exchange，提问作者BenJonroc