页面加载慢,问题出在CSS文件太大——一个页面引用了5个CSS文件,总大小2MB,相当于“让客户搬5箱书才能看到商品”。
后来我们用了PurgeCSS工具,专门“清理”没用的CSS代码。比如,某个页面只用了“按钮样式”和“标题样式”,PurgeCSS就把其他“轮播图样式”“页脚样式”全删了,CSS文件从2MB降到200KB。改完后,页面加载时间从3秒降到0.8秒,用户“立即购买”的点击率涨了40%。
更神奇的是,PurgeCSS还能配合CSS Sprites合并小图标,把10个小图标合成1张图,减少HTTP请求。有个做饰品的朋友,用了这招后,商品详情页的加载时间从4秒降到1.5秒,客户说:“以前等图标加载像看慢动作,现在一打开就能看到所有耳环,太爽了!”
现在这位美妆老板的独立站,不仅加载快了,连Google PageSpeed评分从60分涨到了90分——他说:“原来页面‘减肥’比‘化妆’更重要,瘦了的页面,客户才愿意多待!”
