wepy和mpvue等小程序框架对比记录

随着小程序兴起，不满足于小程序原有的开发方式，wePY、mpvue、taro、uni-app、chameleon等框架逐渐产生。本文针对市面上主流的框架进行了比较梳理，现记录如下。

小程序原生 ——开发文档链接

开发痛点：

组件化支持性差
不支持scss、less等预编译器，不支持webpack
不支持 computed 计算属性和 watcher 监听器；模板语法中只支持简单的 js 表达式
不可多端复用
...

第三方框架

1. wePY——开发文档链接

wePY是小程序上最早的一款类Vue语法的开发框架。WePY 2 是基于小程序原生组件实现组件化开发。因此 WePY 2 支持的最低版本小程序基础库为 1.6.3。支持vue的诸多特性，主要有组件化开发、计算属性和监听器、插槽、基于 Vue Observer 实现数据绑定、更优的可扩展性等。

2. mpvue——开发文档链接

美团团队开源的一款使用Vue.js开发微信小程序的前端框架。完整的 Vue.js 开发体验，方便的 Vuex 数据管理。

3. Taro——开发文档链接

京东凹凸实验室开源的一套遵循 React 语法规范的 多端开发 解决方案。目前 Taro 代码可以支持转换到微信/百度/支付宝/字节跳动/QQ/京东小程序、快应用、 H5 端以及移动端（React Native）。

	小程序原生	wepy	mpvue	taro
开发	腾讯	腾讯	美团	京东
语法规范	小程序开发规范	类vue规范	vue规范	React标准
跨端支持度	微信小程序	支持转换为h5	支持转换为h5	支持转换为h5,RN等六个端
状态管理工具	无	Redux	vueX	Redux /MobX /Dva
组件化	无	自定义组件	VueJs组件规范	React组件规范
样式	wxss	less、sass、stylus	less、sass、stylus	less、sass、stylus、css

更全面的小程序多端框架测评可看凹凸实验室的文章

生命周期

wePY App生命周期同原生，wepy.page包含了 Component 的完整生命周期，也保留了所有 Page 特有的生命周期事件。
mpvue 除了 Vue 本身的生命周期外，mpvue 还兼容了小程序生命周期。不同的是会在小程序 onReady 后，再去触发 vue mounted 生命周期。
taro 同react生命周期

模版语法

wePY 继承了 WXML 的基本模板语法，并把支持大部分 Vue 模板语法经编译器编译后，会将模板标签的转换成标准的 WXML 模板语法。具体html映射表见官方文档。
mpvue 几乎全支持vue模版语法，不支持v-html，不支持部分复杂的 JavaScript 渲染表达式，可支持(+ - * % ?: ! == === > < [] .)。
taro 使用 JSX 作为一种 DSL 进而编译成各端通用的语法。

总结

在小程序不复杂的情况下，建议使用小程序原生开发。

mpvue和wepy都发布2.0版本，多端支持、流行度等方便两端都差不多，但是从组件库方面考虑wePY相对更丰富，两者对比个人建议用wepy。

Taro功能完全，开源建设、多端支持度高，如果不介意学习react或者已经会react的可以使用Taro。

uni-app如果加强开源度，是可以尝试的。chameleon规模比较宏大，看后期建设。