Core Web Vitals 优化，先找到用户具体在等什么

Core Web Vitals 优化，先找到用户具体在等什么

LCP、INP 和 CLS 是体验信号，不是优化清单。指标异常后，要回到请求、主线程和渲染过程，定位用户在哪一步被卡住。

LCP 看资源发现和渲染

确认首屏主内容是什么，图片尺寸与优先级是否正确，关键 CSS 是否阻塞。不要为了指标隐藏真实主内容，也不要把全部资源都设为高优先级。

INP 看长任务来源

把复杂计算拆分、延后或移到 Worker，事件处理只做必要更新。组件按需加载可以减少首屏脚本，但加载失败与占位状态也要设计。

const ChartPanel = React.lazy(() => import('./ChartPanel'));

CLS 给布局预留空间

图片、广告和异步组件提前声明尺寸，字体切换检查回退字形。验证使用真实设备和受控网络，保存页面版本与操作路径。孤立的一次实验不能代表所有用户。