我司一直专注于微信小程序（以下简称小程序）开发，可以说是重仓押注在小程序上。但由于小程序的大小有严格的限制(单个分包/主包大小不能超过2M)。而我们的业务又相对比较复杂，因此常常会突破小程序的大小限制。因此，我们就不得不思考如何优化小程序的大小。
暴力的方式
要优化小程序的大小，最好（最暴力）的方式就是删页面。
这样来，即高效执行起来也简单：统计下所有页面的PV、UV，将一些不活跃的页面移除就完事了。
但是，本文并不是要讲如何移除页面，因为这没什么好讲的。
分析
讲本文的优化方式之前，先分析一下小程序一般都由哪些文件组成的。
一般都是由以下几种文件组成：
.js逻辑文件.wxml页面结构文件.wxss样式文件.json配置文件
也许你会将一些image放在小程序里，一般建议放较小且少量的image，其他都使用网络图片
其中，由于JavaScript有一定的兼容问题需要处理，因此在打包和上传小程序时，开发者工具会对JavaScript进行babel编译处理，故这块可优化的空间比较有限。
而JSON的大小都比较小，且格式较为固定，也没什么可优化的地方。
接下来就是本文要重点说到的WXML了，一般WXSS都是和WXML配套使用的。这两者占小程序的大小比例也比较高，可优化空间非常大，可优化的思路也非常多。本文先讲一下WXML的一个优化技巧。
试验
其实，小程序最终的执行都是以WEB的形式完成的。因此`WXML`可以理解成类似于`VUE`的语法糖，最终都是要编译成`HTML`的。
所以，想要压缩`WXML`代码，就可以参考`HTML`的压缩方式。比如移除多余的空格。
我立马做了个试验，将`WXML`中的部分的空格移除之后，再使用开发者工具上传，发现小程序的大小真的发生了变化，变得更小了。因此可以得出结论，移除`WXML`中的空格是可行的压缩思路。
自动化
既然移除空格是可以减小小程序代码体积的，那么如何实现自动化移除的。
首先我想到的是，利用巨人的肩膀：`htmlparser2`。通过语法分析器，识别`WXML`的空格，并一举歼灭。
绝大多数情况下，这个做法是可行的。但是有一种情况，会导致`parser`识别出错：`WXML`中出现`{{ }}`，且使用了`<`。
因此需要特制一个识别`WXML`语法的`parser`。
由于这样的parser比较简单，因此我就自己上手写了一个：
LeeJim/wxml-parser
实践
通过上述我写的parser，写了一个简单的minifier：
wxml-minifier
安装
npm i -D wxml-minifier
使用
let minifier = require('wxml-minifier')let fs = require('fs')let resource = fs.readSync('./app.wxml') // 假设输入为：<view class="home" ></view> <!-- test -->let result = minifier(resource)console.log(result) // <view class="home"></view>
总结
通过将`WXML`中多余的空格移除，可以将小程序的代码减小大概10%。
其实，从这个角度可以发现，开发者工具在上传`WXML`时，是没有做任何处理的。因此对于HTML的任何压缩方式都可以在`WXML`上使用。当然这也是后续我的`wxml-parser`持续更新迭代的方向。
不知道为什么微信官方在开发者工具上传代码时，不进行简单的简化处理。如果你有答案的话，欢迎在评论中给我回复！
如果觉得对你有用，希望给我一个star，感谢！
如果觉得《微信小程序 自动解决分包大小问题_一个小小的优化 能让你的小程序瘦身10%...》对你有帮助，请点赞、收藏，并留下你的观点哦！
