在线时间:8:00-16:00
迪恩网络APP
随时随地掌握行业动态
扫描二维码
关注迪恩网络微信公众号
uniapp 让我们轻松使用 vue 开发各种小程序。然而,我在实际开发中发现,随着代码数量的不断增长,有两个问题越发凸显:
以我本机(i5-6500CPU @ 3.20GHz,内存16G,64位操作系统)uniapp项目为例:一次全量生产环境编译,花费时间3min+,生成小程序包共30M+。而在开发阶段还需要不停编译,既浪费大量时间,又降低开发体验。 本文记录了我的优化思路,如果你有更好/新的方案,欢迎在评论区留言。 路由文件拆分项目文件较多,路由集中在一个文件内,不利于维护和扩展。 根据 uniapp 文件路径即路由的特性,我们将一组功能、一个活动等具有边界点的页面集生成一个路由文件 图片上传cdn截至2021/11/16日,航班管家小程序打包后的总尺寸有30+M,其中图片占了近八成。将图片上传到 cdn 后,总包大小下降到不足10M。 打包缓存uniapp 提供了开发环境的编译缓存功能。使用很简单,在package.json scripts 命令中增加
在我windows机器上,开发环境编译由原来的3多分钟,降低到1分半钟。后面用 mac 测试,时间没有减少。怪不得官网都没提及这个优化。 单/多文件编译由于项目无限膨胀,全量编译花费的时间直线增长,甚至出现了改一行代码,等1分钟的苦痛局面。为了提升开发幸福感、降低开发怒气值,增加了单/多文件编译模式。 注意,非 src 开头的文件夹名,默认编译
页面下线背景每年都会有许多新活动上线,因为各种原因,我们又不能直接删除过期活动的代码/路由,这些内容白白增加了打包时长和总包大小。 解决方案一个
子包组件引用背景目前航班管家小程序项目已经有20+个子包了,可能出现子包引用其他子包资源的情形。由于微信小程序的分包引用限制,我们要特别关注这种情况。虽然 uniapp 在打包时已经帮我们处理好了静态资源(js、css、图片)的引用关系,但对于子包组件引用,它依然无能为力(不警告、不报错)。 解决方案uniapp 把每个有效的 |
请发表评论