上个月有个做工业设备的客户找过来，说他们的官网"感觉有点卡"。我打开一看，首页 6.8MB，光首屏轮播图就三张，全是相机原图直接上传的。这种情况在企业站里太常见了，不是技术做不到，而是从来没人系统地从头到尾看一遍。
网站慢最麻烦的地方在于，它不是一次故障，而是每天都在持续流失客户。广告投了、排名做了，结果人进来第一秒还是白屏，后面的内容写得再好也没人看。
先弄清慢在哪，再动手
优化之前先把问题量化。PageSpeed Insights 和 Chrome 自带的 Lighthouse 跑一遍，就能拿到几个关键指标：
- LCP（最大内容绘制）：主内容出现的时刻，控制在 2.5 秒以内才算健康
- CLS（累积布局偏移）：页面元素跳动的程度，超过 0.1 用户就会明显感觉"闪了一下"
- INP（交互到下一次绘制）：点击之后多久有响应，200 毫秒以内才算顺畅
这几个就是常说的核心网页指标，搜索引擎会直接把它们计入排名计算。换句话说，速度不只是体验问题，它本身就是排名因素的一部分。
图片：企业站的性能大头
把首页所有图片导出来按体积排个序，你会发现前几张就占了八成以上的体积。处理的顺序一般是这样：
- 转成 WebP 或 AVIF：同样的清晰度，体积通常能比 JPEG 小三到五成
- 按显示尺寸出图：展示区只有 800 像素宽，就不要上传 4000 像素的原图
- 首屏图预加载：用
<link rel="preload" as="image">提前拉取，别等到 CSS 解析完才去下载 - 其余图片懒加载：加上
loading="lazy"，滚动到可视区域再发请求
顺手提醒一句，懒加载千万别用在首屏图上，否则 LCP 反而会更难看。
脚本和第三方挂件的负担
企业站上挂的东西往往越加越多：在线客服、统计代码、地图组件、社交插件。每一个都是一次额外的网络请求，其中不少还会阻塞渲染。
处理办法其实很朴素，把非必要的脚本加上 defer 或 async 属性，让它们不要挡着页面渲染；聊天挂件这类不影响首屏的，可以延迟几秒再加载。至于那种一年也没人点过一次的插件，该下就下。
缓存与 CDN
静态资源基本不会天天变，那就让浏览器把它存起来。在服务器配置里给图片、CSS、JS 设置较长的过期时间，配合文件名哈希做版本更新，用户第二次访问几乎就是秒开。
如果客户分布在多个地区，再上一层 CDN，把资源推到离访客更近的节点。这一步对跨省访问的站点效果特别明显，通常能把首字节时间压掉一半以上。
性能优化不是一次性的项目，而是一条需要长期守住的线。
—— 一位被 6MB 首页折磨过的运维
留一条底线
改完之后别急着上线，用 Lighthouse 再跑一次，把分数和之前对比。更重要的是给团队定个规矩：以后上传图片必须先压缩，新增第三方脚本要过一遍审批。没有这条底线，三个月后网站又会回到原来的样子。