从8秒到0.8秒，一次让千万名用户受益的网站瘦身实战

2019年春天,一个日均PV超过3000万的资讯平台，在用户投诉“页面打不开”“滑动卡死”的浪潮中挣扎，当时的首页加载时间长达8.2秒，服务器CPU负载经常飙升至95%，运维团队连续加班三周却收效甚微，直到我们介入进行了一次彻底的网站优化，最终让首屏时间压缩至0.8秒，服务器负载下降83%，这场优化，直接影响了平台千万名用户的访问体验。

第一步：速度诊断——找到“罪魁祸首”

优化前,我们先用Chrome DevTools的Lighthouse跑分，结果惨不忍睹：Performance得分仅为23，接着使用WebPageTest进行多地域、多设备测试，发现几个核心问题：

• 资源体积过大：首页单页请求数高达187个，总大小超过4.2MB，其中一张Banner图就占了1.8MB
• 渲染阻塞严重：CSS和JS文件未经任何处理，全部同步加载，导致首屏白屏时间长达3.5秒
• 缓存失效：未设置任何强缓存策略，每次访问都是完整的HTTP请求，重复加载率达到100%
• 服务器响应慢：TTFB（首字节时间）高达1.6秒，原因是未开启Keep-Alive且PHP进程数配置过低

第二步：压缩与合并——把“臃肿”变“精干”

针对图片,我们统一采用WebP格式（兼容性通过Picture标签兜底），并结合Imagick进行有损压缩，一套工具下来，仅首页Banner就从1.8MB降到了180KB，肉眼几乎看不出区别，所有小图标全部转为SVG Sprite，将10个独立图标文件合并为1个，减少10次网络请求。

CSS方面,我们将所有非关键的样式（如“关于我们”“底部导航”等首屏不可见区域的样式）抽离为“非关键CSS”，通过 media="print" 配合 onload 事件进行异步加载，核心的、仅3KB的“关键CSS”直接内联在HTML头部，同时使用CSS Nano进行深度压缩，最终整个CSS文件体积从原来分散的87KB下降到合并后的29KB。

从8秒到0.8秒，一次让千万名用户受益的网站瘦身实战

JS优化则更为细致,首先梳理依赖关系，将jQuery、公共函数库等基础库打包为vendor.js，再将业务代码按路由拆分为多个chunk，利用Webpack的代码分割功能实现按需加载，同时进行UglifyJS压缩和Tree Shaking，将冗余代码剔除，混合优化后，JS总请求数从52个减少到9个，体积从1.2MB压缩到406KB。

第三步：缓存配置——让“重复访问”不再重复

我们在Nginx层开启了强缓存策略,对图片、CSS、JS等静态资源设置 Cache-Control: max-age=31536000, immutable，这意味着用户在一年内再次访问时，浏览器会直接从本地缓存读取，零网络开销。

对于HTML页面,由于内容会更新，我们配置了协商缓存：ETag 加上 Last-Modified 双保险，服务器响应304状态码的速度仅需20-30ms，远低于重新生成页面的500ms。

同时在应用层,利用Redis对数据库查询结果进行页面局部缓存，例如文章列表页的“热门推荐”模块，原本每次请求都需执行4次SQL查询，缓存后直接从Redis读取，响应时间从350ms降至4ms。

第四步：CDN加速——把内容“搬”到用户家门口

我们选用了支持HTTP/2的CDN服务商，并在边缘节点开启Brotli压缩（比Gzip多压缩约20%），将静态资源全部部署到CDN，同时开启预加载：在用户访问首页时，通过 <link rel="preload"> 强制CDN边缘节点提前向下一个页面（如“新闻详情页”）发起请求，将资源从源站拉取到节点，当用户点击跳转时，资源已经在CDN节点上，实现毫秒级加载。

实测数据显示,未使用CDN时，新疆地区的用户加载首页需要9.2秒；接入CDN并配置国内35个节点后，同一地区加载时间降至1.1秒。

第五步：服务器优化——让“后台”跑得更快

我们将Nginx worker_processes从默认的4调整为CPU核心数（8个），开启 sendfile 和 tcp_nopush，减少内核态与用户态的数据拷贝，同时启用gzip_static，预先压缩静态文件，避免每次请求都进行实时压缩。

针对PHP-FPM，我们将进程最大数从50调整为200（根据服务器内存16GB计算），并开启OPcache，OPcache命中率从优化前的45%提升到98%，PHP执行时间从300ms降至18ms。

最终实测数据对比

优化上线后第二天,平台的技术负责人发来消息：“用户投诉归零了，页面秒开，广告点击率提升了40%，感谢你们。”那一刻我们知道，这不仅仅是一次技术优化，更是对千万名用户等待时间的尊重，每一次HTTP请求的消除，每一个KB的压缩，每一层缓存的命中，都让这个数字世界变得更加轻盈、高效。