
页面体积膨胀主要是历史积累造成的。插件样式重复引入、图标字体整套加载、注释和空行没有清除、多个小文件串行请求,都会使首屏变慢。
从统计开始清理。按照体积大小排列产物,找到占比最大的文件;用覆盖率工具来记录实际使用的样式规则的比例,如果长期低于三成的话,那么就可以进行精简了。未引用的脚本和组件根据依赖关系进行删除,在删除之前要确认没有动态调用。
压缩、合并传输层。开启代码压缩和传输压缩,去掉注释和空白;小文件适当合并来减少请求数量,经常更新的模块保持独立,防止一次修改就使整个包失效。
加载顺序会影响感知速度。样式放在文档头部,非关键脚本延迟执行,首屏必须逻辑保持一致;字体用局部子集而不是整个字库,图标改成按需引入。
每次清理之后比较资源数量和首屏时间,连续两次没有收益就可以停止了,防止陷入不断重构的循环中。