从16年微信小程序内测的时候到如今,微信小程序用时间与实践证明了自己的变革与价值,成都小程序开发的规则也在开发社区的影响下变得更加完善。
对于第三方企业来讲,微信为自己带来了巨大的流量入口和低成本的拉新渠道。像共享单车类的企业,微信是绝大多数用户的二维码扫码入口,小程序为其带来了巨大的流量入口,如摩拜单车。
对于成都小程序开发者来说,小程序的开发生态不断地在完善,从最开始的原生框架,到腾讯自己开发类vue规范的wepy,再到美团开发近vue写法的mpvue,再到最近O2实验室刚推出的遵循React规范的Taro。
所有到现在,有多种开发微信小程序的方式,主要有原生,wepy,mpvue,Taro,4种框架,对比分析也是在这4种方式中。
2. 框架对比与分析
面对4种开发方式,我们到底应该选择哪种呢?首先当然是对各种框架进行对比分析,从开发工具便利上,开发方式上,应用状态管理上,社区活跃程度上(开源UI库等)
2.1 开发工具工程化上
开发工具上:都需要微信开发者工具来调式,对于写代码的话,尤其我们前端开发来讲,21世纪最有良心的编辑工具无疑是微软出品的vscode,代码高亮的话,都需要相应的配置,具体怎么配置,可以网上搜(或者看各个开发方式的官方文档)。
工程化上: 微信小程序本身对工程化几乎没有任何的支持,要原生框架支持工程化的话,需要自己动手搭建很多工程化上的东西-他人搭建的demo wxapp-redux-starter,wepy有自己的wepy-cli,而mpvue和taro则很好的支持我们熟悉的webpack灵活定制(像语法检查,热更新等等)
2.2 开发方式上
原生开发:
我们需要全新学习小程序的抒写格式,目前版本模板中支持 slot,但是不支持 npm 包。原生不支持 css 预处理器,但是 vsCode 中 Easy WXLESS 插件可以将 less 文件自动转换为 wxss 文件;
wepy:
我们需要熟悉 vue 和 wepy 两种语法,支持 slot 组件内容分发插槽,支持 npm 包,支持 css 预处理器;
mpvue:
我们需要熟悉 vue ,目前版本(v1.0.13)不支持 slot ,支持 npm 包,支持 css 预处理器;
taro:
采用React语法标准,支持 JSX 书写,让代码更具表现性,Taro暂不支持直接渲染children。
对于mpvue和taro开发方式上,对vue和react语法的支持程度和差异上具体可以看各自的官方文档。
2.3 应用状态管理上
原生开发:
没有提供原生的应用状态管理方式,但是可以将 redux or mobx 引入到项目中。
小程序原生提供了一种声明使用全局变量,具体写法可查看文件作用域。
wepy:
可以将 redux or mobx 引入到项目中。
mpvue:
可以直接使用 vuex 做应用状态管理,在用mpvue初始化时可以选择是否需要vuex.
taro:
支持redux,对于不那么大的应用也提供了全局变量的解决方式,redux引入和全局变量解决方式,具体可以查看官网-使用redux。
2.4 社区活跃程度上
原生开发:
成都小程序开发对UI库来说,原生小程序UI库还是蛮多的,例如易扩展的微信小程序 UI 库。
其它3个框架:
对于wepy,mpvue,taro这种开源项目来说,想学习交流那肯定是在github的issue上啊,github上的star数和项目出现时间成正比,wepy : 12k多star, mpvue: 11k多star, taro: 6k多star,从趋势看,mpvue大有赶超wepy的趋势。
对于wepy,mpvue它们的github上都有些开源的UI库,而taro由于最近推出,UI需要自己去撸。