作者｜携程前端框架团队在PC、H5、小程序等方面为携程集团各业务线提供优秀的Web解决方案。产品涉及各类前端/Node端应用框架、研发工作台、前端中台化、静态资源发布系统等。目前主要关注方向包括：新一代研发模式探索、Rust升级构建工具链、Serverless应用框架开发、在线文档系统开发、低代码平台构建、老龄化无障碍探索等一、背景众所周知，无论是微信小程序、支付宝小程序或者其他类型的小程序，代码包的大小是有限制的。目前微信官方规定整个小程序不超过20M，单个子包或主包大小不超过2M。之所以这样限制，是出于对小程序启动速度的考虑。微信希望用户在使用任何一个小程序时都能得到“二次打开”的体验。这正是小程序的优势所在，但同时也对开发者提出了更高的要求。携程小程序涉及30+条业务线，数百名开发者。目前包大小已经接近微信限制的20M限制。如果包体积过大，势必会导致新业务受限、启动缓慢等问题。这些都会给用户带来问题。用户体验不好，所以Size的管理势在必行。为了合理有效地利用有限的Size，我们设计了一套自己独有的Size治理方案，如图1所示：图1携程小程序的Size治理从图中可以看出，Size治理包括Size监控机制和主包文件管理机制，这两个机制的实现离不开小程序管理平台的支持。小程序管理平台是携程内部管理各类小程序（微信、百度、支付宝等）的官方系统，是集小程序配置、发布、审批、数据统计为一体的系统。接下来我们就来详细介绍一下。2.大小监控机制2.1大小分配我们在《携程微信小程序如何协同开发?》一文中提到，携程将整个小程序分成了几十个业务线（也就是bundle），每个bundle可以有多个分包。我们为每个bundle设定一个约定的阈值，包括两部分：永久大??小+临时大小。顾名思义，永久大小是bundle的固有大小，临时大小是指在约定日期自动恢复的大小。该信息是在小程序管理平台系统中配置的，如图2所示：图2Sizeallocation从图中可以得到可以看出pages/train的Size为：1888KB（permanentSize）+155KB（temporarySize）).在达到约定日期之前，Bundle的开发者必须将代码调整到永久大小（即1888KB），否则Bundle在提交新代码时将无法通过Sizecheck阶段。2.2大小检测每当业务方向发布分支提交代码时，都会自动触发管道的构建。这时候会检测到当前bundle的实际大小。如果超过约定的Size值，构建过程将被强制中断，并发送失败信息给相关发布组和开发人员，强制代码不提交到发布分支，从而实现Size检测能力，报错信息如图3：图3Size检测结果通知通过Sizeallocation和Sizeinspection，迫使业务方主动优化代码，将流量较小的旧业务代码下线，为新业务提供空间。同时，我们还提供尺寸申请审批流程。业务方可通过申请临时尺寸获得额外尺寸空间。如果临时尺寸满足内部要求，他们也可以申请转换为永久尺寸。2.3尺寸申请审批当Bundle上线新需求需要申请临时尺寸时，BundleOwner可以在小程序管理平台创建临时尺寸申请表，相关委员会决定是否通过临时尺寸申请。赞同。如果以后想把临时尺码转为永久尺码，需要有充分的理由，并且对性能指标达成一致，才可以申请永久尺码。应用平台如图4所示：图4Size申请审批增加了Size的申请成本，促使业务方更合理地利用有限的Size，防止无限的代码堆叠和代码冗余。2.4Size提醒为了督促各业务方按时归还临时Size，防止因Size不足导致发布失败，我们设计了Size提醒机制，每天会向满足任何一个BundleOwner的BundleOwner发送消息提醒以下内容：捆绑临时大小；临时大小过期的Bundle；大小超过限制的捆绑包。提醒消息如图5-6所示：图5临时Size倒计时提醒图6Size超限提醒通过消息提醒，提示BundleOwner优化代码，合理降低Size，起到预警作用、监管、通知，防止临时规模恢复导致新业务无法正常发布。2.5Size数据统计在小程序管理平台中，我们还提供了数据统计功能，可以展示BU维度、Bundle维度、分包维度等多个维度Size的趋势变化；BU的大小比例如图7-8所示。通过统计，我们可以直观的了解到各个业务线的活跃度以及Size的分布情况。图7BUOverallSizeTrendFigure8BundleSizeTrend3.主包文件管理机制每个小程序都必须有一个主包。所谓主包就是放置默认的启动页或TabBar页面，还需要一些分包公共资源。当小程序启动进入非独立分包页面时，会默认下载主包，并自动执行主包的脚本。主包的大小直接影响首屏的渲染性能，关系到用户的初次使用体验。因此，主包文件的管理很重要。下面将从对主包文件的管理和检查进行详细介绍。3.1主包文件管理小程序管理平台提供了对主包文件的可视化管理功能，可以在管理平台上配置对主包文件的查看、添加、删除操作，如图9所示：图9主包文件管理通过管理平台，我们可以快速获取主包中的文件内容以及文件的归属。配置的数据将作为检查主包文件的参考。3.2主包文件检查每当提交流水线构建代码时，我们会通过微信规则过滤掉可能打包到主包中的文件，并将此列表与小程序管理上配置的主包文件列表进行对比platform，如果有未配置的文件，构建过程将被强制中断，构建结果将发送给相关的发布组，即开发者，从而实现对主包文件的管理。报错信息如图10：图10主包文件经过检查清理主包文件，严格限制主包内的文件，主包大小下降了46.5%，如图11,现在已经稳定下来了。主包管理机制，防止业务线随意向主包添加文件，可感知、可控，对提升首屏渲染性能具有重要意义。图11主包文件大小变化趋势三、总结综上所述，携程小程序Size治理方案主要包括Size控制机制和主包文件管理机制，实现分配、检测、申请、提醒、统计Size的能力，该方案在微信小程序中得到了充分的实践，小程序的尺寸和比例展示更加直观透明，杜绝随意滥用。目前微信小程序的规模已经趋于稳定，未来会逐步应用到其他类型的小程序中。
