来源
公司写的内部分享
本篇文章也是我写的,在21年的元旦中完成过一次Taro小程序分包,也和公司交流过同意将文档分享
一、背景
此前,只有C端项目组增长线+APP招生线 业务用途才使用到小程序项目,并且增长线在元旦期间主导进行过小程序分包优化。
后续布局:各业务团队都涉及到了到了taro进行开发小程序,小程序分包是项目一开始就应该制定规范标准和实施的。
优化后,分包效果甚好,该文档主要介绍分包的应用场景和使用方法。
二、小程序分包是什么
官网介绍很详细 普通分包官方文档
三、为什么我们需要分包
1. 多种业务集成在一个业务模块内。
- 多个业务有不同的场景的话,不同的业务场景对入口文件可能会有不同的逻辑要求(如:微信直播间强烈依赖scene和正常购课页不依赖scene),会造成入口文件难理解和冗余。
2. 多个业务团队共同开发维护一个项目。
每个人的风格不尽相同,分包可以避免与其他业务交叉,各个团队只需要维护自己的分包内容即可
整包恐体积过大影响上传****
微信官方基础库版本1.7.3之前是每个包(分包、主包)限制大小1M,超过该体积无法上传,而后改为2M。
如果APP中任一个包过大都会导致发布失败:
但是通过微信CI上传可以绕过这个问题
2. 插件体积过大
插件体积大并且放在主包会,污染主包,会造成的主包庞大。 如果插件的使用是APP非必要访问路径,推荐放入分包。
3. 为了进一步优化
四、分包思想
C端分包采用的思想是:只提供给这个用户访问到的路径作为一个包。
用户在进入第一个页面的时候,就已经知道这个用户的可访问路径。这时候可以把用户可能访问的路径完整链路的放入一个包内。
如购课页用户只会访问到购课页相关的订单页、选课页、地址页、售后页,并不会访问到邀请有奖和其他活动页面,所以这就可以把购课页相关的页面放入一个包。
如果订单页多业务通用,则将订单页单独抽离出一个包。
五、小程序分包配置
我们公司研发团队中,B端/C端也都是采用Taro框架进行多端开发(H5/小程序/应用商店微应用)。
Taro框架架构普通分包
非常简单,由于Taro是通过webpack方式进行构建打包的,所以无需考虑过度引用分包的问题。
六、小程序分包影响面和解决方案
- 页面放入分包后,会对原有的页面路径改变,造成用户访问原来的页面404
- 兜底方案1:保留原有的页面路径在主包中,只保留跳转逻辑代码,用户进入后可直接跳入到相应分包页面。
- 兜底方案2:在入口文件app.ts didShow(小程序的onLaunch)加入路径页面判断跳转,跳转进入分包页面。
- 基于小程序更新机制,发布新版本小程序之后,无法立刻影响所有现网用户
- 最差情况下是24小时完成全部版本下发更新(官方)
- 在小程序入口增加UpdateManager管理更新
七、小程序分包低版本兼容性
对于不兼容小程序分包的版本会将分包自动转为整包,不影响用户正常访问
*整包:未进行分包处理的代码。
八、如何验收成果
- 构建代码
- 上传代码到平台
- 上传后,微信开发者工具-详情-基本信息-本次上传即可查看
关于我近期规划和实施在做的小程序优化:[已完成]grow_mp项目小程序端优化规划#statistic