之前有一篇文章讲了速度优化的十个方法。今天这篇是实战记录——帮一个内容站实际做了一次速度优化的完整过程,从5秒降到接近1秒。每一步做了什么、效果提升了多少都记录下来了,你可以照着做。
优化前的加载时间测试:桌面端完全加载约5秒,移动端约7秒以上。拖后腿的主要是图片未经压缩一张背景图就两M多,CSS和JS文件散落着引用了十多个文件每个都要单独请求,外加没有开启Gzip压缩也没有配置缓存。
第一步压缩图片。把所有页面图片批量跑了一遍压缩工具。那张两M多的背景图压到了几百K。这一步降了大概两秒——效果最明显的一步。
第二步合并CSS和JS。把分开的几十个CSS和JS文件合并成一个CSS和一个JS。请求次数从几十次降到了十几次。这一步降了零点几秒。
第三步开启Gzip。服务器面板上一键打开之后测试文件传输体积降了大约百分之六十。又降了零点几秒。
第四步配置CDN。把图片和静态文件全部切到CDN上。国内用户访问的速度提升很明显。降了大概一秒。
第五步配置浏览器缓存。图片和CSS设置一个月的缓存时间。二次访问的用户加载速度直接降到零点几秒。
测速工具跑出来的最终结果:桌面端加载时间降到1.2秒左右,移动端降到2秒左右。从5秒到1秒,五步操作加上转服务器前后不到一天的工作量。
速度优化做完之后两周内抓取频率就开始上升。在VP导航(vpis.cn)上的访问体验也明显改善了。速度优化不是高深技术,愿意动手就能做到。
