作者
马可
导读
小程序编译器是百度开发者工具中的编译构建模块，用来将小程序代码转换成运行时代码。旧版编译器由于业务发展，存在编译慢、内存占用高的问题，我们对编译器做了一次大规模的重构，采用自研架构，做了多线程、代码缓存、sourcemap等多项优化，在性能和内存占用上都有很大提升。全文介绍了新版编译器的设计思路和优化方法，以及一些能够用在通用打包工具里的技术点。
全文字，预计阅读时间17分钟。
01前言小程序编译器在小程序开发、预览、发布各个阶段都需要使用，因此编译器性能会直接影响到开发者开发效率，也会影响到开发者工具的使用体验。
由于旧版的编译器（基于webpack4）在构建大型项目时会很慢，内存占用也高，一直被开发者吐槽。我们经过大量的调研和开发，最后采用完全自研架构做新编译，针对小程序项目构建做了大量优化，基本解决了旧编译存在的问题。
下图是部分项目构建时间对比：
新版编译器相对于旧版实现了2~7倍的性能提升，并且支持实时编译、热重载等特性，内存占用更少，构建产物更优。
下面从框架选型、新编译器工作原理、性能和产物优化方法等方面介绍新版编译器的成长之路。
02框架选型在进行新版编译器设计时，需要明确当前的痛点问题：性能，优先解决性能问题。其他新技术和新想法对编译器有帮助的也一起实施。
旧版编译器基于webpack4存在如下几个问题：
大型项目构建速度太慢。
dev启动慢、增量编译慢，仅支持loader缓存，bundle无缓存也比较慢。
基于webpack4做扩展开发，需要patch部分模块才能工作，维护困难。
部分webpackbundle过程无法针对小程序代码结构进行优化，存在无效构建。
新编译的设计目标：
更快的全量编译速度，消除webpack存在的无效构建过程。
支持全缓存，加快首次和增量编译速度。
支持实时编译，减少dev启动和二次编译时间。
支持多线程编译加速，支持页面热重载。
优化产物结构，减少产物体积。
2.1主流构建工具下面介绍的是我们调研过的主流前端构建工具，每个工具都有适用场景和优缺点。
在新版本编译器架构设计时，其他构建工具的设计理念和技术特点都值得参考。
Webpack构建过程：
Webpack优点：功能完善、社区活跃、可配置性强、有很强的扩展性。
Webpack缺点：配置复杂、构建速度慢，二次开发困难。
Parcel构建过程：
Parcel优点：无需配置，构建速度快，原生支持多线程和全缓存，多线程之间共享数据通过lmdb进行，避免跨线程通信开销。
Parcel缺点：生态小，自定义性有限，大量采用Node插件，兼容性也差一些。
Vite构建过程：
Vite优点：配置较为简单，按需编译，启动快，dev时有不错的体验。
Vite缺点：生态小，dev和发布走两套构建流程。
其他小程序平台：