为企业网站优化 Core Web Vitals

如果页面加载缓慢，用户会在最初三秒内离开。Google 深知这一点，并自 2021 年起将 Core Web Vitals 纳入排名因素。对企业网站而言，速度不再只是技术细节，而是营收。

必须牢记的三项指标

LCP 衡量最大元素出现的时间。INP 衡量输入延迟。CLS 衡量布局偏移。一个优秀的页面需要 LCP 低于 2.5 秒、INP 低于 200ms、CLS 低于 0.1。

• LCP — 优化图片并优先加载首屏内容。
• INP — 拆分 JavaScript，避免阻塞主线程。
• CLS — 为图片、字体和广告预留固定尺寸。

我们如何达到 95 以上

我们从架构入手：服务端渲染、按路由拆分包，以及对首屏以下的一切进行懒加载。图片以适配设备尺寸的 AVIF/WebP 提供；字体使用 font-display: swap 加载，让文字立即显示。

性能不是一次性的任务，而是每一个 pull request 中的纪律。

— Huy Nguyễn

最后，我们引入真实用户监控（RUM），在真实设备上而非仅在实验室中追踪指标。这正是漂亮数字与真正快速体验之间的差别。