小程序转译框架对比（uniapp, taro, mpvue, wepy2, chameleon）

最近因疫情被困家中，有点时间把现在市面上主流的小程序转译框架都试用了一下，没有做深度试用，只是有个初步体感，各框架的性能数据在官方文档里也都有提供，大家可以自行查阅，如有说的不恰当的地方还请指正。
目前市面上转译框架众多，新的框架也在陆续输出，个人认为，做小程序转译框架应该注意以下几点：

• 解决了原生平台的哪些痛点？跨平台 or 组件化 or 性能提升？
• 小程序的DSL已经趋于一致，不要再引入新的DSL
• 尽量降低用户的学习成本
• 生成后的代码是否可控
• 配套工具是否完善易用

1. 对比

下面从以下几个方面对各个框架进行对比：

• 跨平台
• DSL
• 学习成本
• 性能
• 配套工具的易用性

跨平台

框架	微信小程序	支付宝小程序	QQ小程序	头条小程序	百度小程序	快应用	H5	Android	IOS
uniapp	✅	✅	✅	✅	✅	❌	✅	✅	✅
taro	✅	✅	✅	✅	✅	✅	✅	✅	✅
mpvue	✅	❌	❌	❌	❌	❌	❌	❌	❌
wepy	✅	❌	❌	❌	❌	❌	❌	❌	❌
chameleon	✅	✅	✅	✅	✅	✅	✅	✅	✅

• uniapp，chameleon通过jsbridge支持移动端
• taro通过react native支持移动端
• mpvue与wepy只是一套使用vue语法开发小程序的框架，跨平台能力较弱

DSL

• uniapp, mpvue: 纯vue语法+抽象过的小程序api
• taro：纯react语法+抽象过的小程序api
• wepy：类vue语法，但引入了新的dsl，文件后缀名为wpy
• chameleon：支持vue语法，但引入了新的dsl，文件后缀名cml

学习成本

根据以上关于DSL的描述，引入了新DSL的学习成本势必要高于其他，而chameleon为了跨平台，限制要比wepy2多一些，因此由易到难依次为：

uniapp/taro < mpvue < wepy < chameleon

性能

性能可参考这篇文章：小程序开发：用原生还是选框架（wepy/mpvue/taro/uni-app），里面有详细的测试过程

配套工具的易用性

• uniapp：配套IDE+vue项目模版，两者可选
• mpvue：vue项目模版
• taro，wepy，chemoleon均提供了配套的cli工具

过程中对uniapp提供的IDE(HBuilderX)进行了试用，不知是自己网速问题还是什么，App开发版下载很慢，始终没能下载成功，最终下载了标准版，运行速度很快，包含智能提示，转到定义等常用coding功能，还可以使用内嵌浏览器进行预览和模拟等常用工具。
这里要对chemoleon吐槽一下，其他四个框架使用过程均很顺利，唯独chameleon耽误了些时间，开始是chameleon-tool下载一致报错，问了谷歌后，听人说是node版本问题，无奈使用n将node切换到了9.11版本，下载完chameleon-tool，创建项目后却无法运行，将node切换到最新版本(12.x以上)后，终于成功将项目运行起来

2. 总结

转译框架琳琅满目，以上只对目前一些主流的框架进行了试用和对比，针对如何选择，有以下几点建议：

1. 小程序的DSL正在逐渐趋于一致，阿里也正在推动这一进程，如果你对原生框架信手拈来，使代码更可控，且迁移成本可以接受，那么可以选择使用原生框架开发
2. 如果你喜欢并熟悉react，那么taro是目前的唯一选择，且现在用户量不少，社区也比较活跃，对小程序平台的api进行了抽象，且同时支持调用原生平台的api，灵活可扩展
3. 如果你喜欢并熟悉vue，那么uniapp是更好的选择，配套工具齐全，且在开发者服务领域经验丰富，测试全面，反馈处理速度快，底层还做了很多优化工作。除对api进行抽象封装后，也支持直接调用各平台特有api
4. chameleon也是类vue语法，与uniapp完成的事情类似，但引入了新的DSL，增加了学习成本，且试用下来，从设计理念到配套工具的提供，感觉还是uniapp做的更好一些
5. mpvue和wepy都是使用的vue语法，跨平台能力很弱，是早期在小程序还不支持自定义组件时为了可以组件化开发小程序而产生的，目前来看，同样是vue语法，选择跨平台能力更强的uniapp和chameleon更好一些