Core Web Vitals 优化：先找到真正影响用户的那一段
LCP、INP 和 CLS 是结果指标，不直接告诉我们该删哪行代码。优化前要把指标落到具体页面、元素和用户操作。
从真实路由和设备分组
区分冷启动、缓存命中、网络与设备档位，找到贡献最大的页面。实验室工具用于复现，线上聚合用于判断影响范围，两者不要混成一组数据。
顺着渲染链路定位
LCP 看资源发现和主线程阻塞，INP 看事件到下一帧的工作，CLS 看没有尺寸约束的内容。内存泄漏则通过长会话和堆快照单独排查。
- 图片预留宽高并按视口加载。
- 长任务拆分但不打乱状态顺序。
- 第三方脚本记录加载和执行成本。
改一处，复测同一路径
性能数字带上版本、样本量和统计窗口。没有条件的“提升百分比”很难用于后续维护。
前端性能优化不是追一个绿色分数，而是把用户等待对应到资源、脚本和渲染阶段。
原稿中的最小片段
const ChartPanel = React.lazy(() => import('./ChartPanel'));
这段片段保留原样，只用于说明接口形态；接入项目时仍要补齐类型、错误和测试。
