uniapp小程序优化和减小代码体积的方式

本文介绍了针对微信小程序开发时遇到的压缩包体积过大问题的解决办法,包括将静态资源存放到CDN,区分dev和生产环境的依赖管理,利用分包预加载机制优化加载速度,以及清理冗余代码等措施,有效降低了小程序的体积并提升了运行效率。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

接触过小程序的人都知道小程序的的压缩包不能超过2MB,否则无法将之上传到微信小程序,在开发中很容易忽略这个压缩体积大小,没有对自己的写的代码进行一个优化。
以下只是个人的简单优化的方式,如有更好的方式可以给出意见。

(1)检查一下静态资源,图片和各个图标将近1MB。为了解决体积大的问题,将静态资源的图片放在cdn服务器进行路径请求,压缩体积将近释放1MB。
(2)将通过webpack下载的包和插件进行dev和生产分类,原先是默认都是下载到dependencies,这就导致了压缩之后面积也很大。因此为了减少体积,将一部分只在本地调试使用的插件版本放到devDependencies里面,分类完成之后在打包压缩,发现体积小了一些。如果到这体积还是很大,那就得采用官方提供的分包加载机制了。
(3)采用subPackages分包分包加载机制(具体教程看看官方文档)
这个分包预加载我是按照tabBar来划分页面和分包的, pages加载可以把首页涉及到的页面和资源加载,首页加载的公共资源的东西都可以在pages里面加载, 其他的根据tabBar的路径来加载对应的页面和资源(使用预加载)。然后在manifest.json设置分包的优化:在manifest.json→源码试图→找到"mp-weixin",添加"optimization" : {“subPackages” : true}即可完成任务。
(4) 如果上面之后还是觉得压缩体积大,那么继续优化页面代码,将一些中文注释都给清掉,对页面重复冗余或者用不着的代码都清掉。

评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

追逐梦想之路_随笔

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值