主包大小有限制,做到后期常常突然传不上去。翻一遍代码,体积基本都堆在几类资源上。
一、图片是第一大头
设计稿直接导出的 PNG 动辄几百 KB,一个页面放几张就吃紧。能压的压、能换 WebP 的换、能放服务器上的就别打进包里。
- 本地图片统一压缩
- 大图改为网络地址
- 图标优先用字体或 SVG
二、没用到的组件和库
早期试过又没删的组件、整套引入却只用了两个方法的工具库,都会算进主包。定期看一次打包分析,删掉确实是死的那些。
- 看一次打包体积报告
- 按需引入替代全量
- 清理废弃页面
三、该分包就分包
低频功能,比如设置、帮助、历史归档,拆到分包里,首次打开只下主包。用户感知的启动速度也会跟着好一截。
- 按访问频率拆包
- 主包只留首屏必需
- 分包预下载按需开
写在最后
上面这些是我们在这类项目里反复碰到的情况。业务不一样,做法不必照搬,先把自己的流程说清楚,再决定系统该怎么配。有具体场景想聊,电话或微信找我们就行。
