多端统一技术方案选型

概述

本文是记录我们在寻找多端统一技术方案选型的一个过程，也是我自己的一个思路。主要用来记录这个过程，结果并不重要，通过本次事件，让我能多方面考虑，综合思考，最终决定某项技术方案在团队的落地，这适用于所有的技术选型上以及在其他的事情上面，我们也应该学会多方位的思考，做到一件事的充分准备和有理有据，而不是说现在大家都怎么怎么样，我们就可以闭着眼睛这样去做，虽然最终结果我们还是跟闭着眼睛去选是一样的，但是这个思考的过程是很重要的，他让我们在别人提出质疑和疑惑的时候，有充分的准备来告诉对方，我们是慎重的一个决定，而不是随心所欲，随便做的。

需求目的

在设备多端，以及应用承载方式越来越多，各大平台技术孤立的时代，作为公司运营和技术开发团队，我们需要寻找一套可靠，优秀的技术解决方案，来提升我们开发实现产品的效率，降低实现的技术成本，以及达到最好的产品效果。

考虑因素

项目因素

项目规模，我们的应用需要支撑上百万用户的使用
重要程度，迅雷电影是我们团队及部门目前最主要的产品突破点
时间要求，目前迅雷电影已经有很多产品需求，对于多平台的实验，技术实现时间上肯定是越快越好
需要支持SEO
希望是实现沉浸式的体验
希望能达到比现在更好的性能体验
希望能在更多的端实现统一的产品体验

团队因素

项目目前技术栈主要是 Vue + Next + VueX + Node
成员技术栈 Vue React Flutter React-Native
成员对现有技术的满意度以及对新技术的期望

技术因素

能否满足功能需求
能否满足性能需求
易用性
可维护性
可扩展性
技术成熟度
社区活跃度
开发者或支持团队活跃度
是否存在license问题
学习曲线如何

技术选型

候选技术

原生开发
阿里 Weex
Facebook RN
Google Flutter
京东 Taro
美团 MpVue
DCloud uni-app
腾讯 Wepy
去哪儿 Nanachi
滴滴 Mpx
网易考拉 Megalo
微信支付 Omi-mp
滴滴 Chameleon

初步筛选

京东 Taro
DCloud uni-app
美团 MpVue
腾讯 wepy
滴滴 Chameleon

详细对比

多端支持

多端/方案	Taro	uni-app
Android	√	√
iOS	√	√
H5	√	√
微信小程序	√	√
支付宝小程序	√	√
百度小程序	√	√
头条小程序	√	√
多端编译方式	√	自研条件编译
跨端组件库	√	√

流行活跃度

流行度/方案	Taro	uni-app
GitHub Star	16588	3734
GitHub issue/PR	382	54
NPM/CNPM 下载量	4413
案例	丰富	丰富 1万+
开发者人数	~5000
自建开发者社区	√ 有	√ 有

开发工具

工具/方案	Taro	uni-app
语法规范	React, 类原生	Vue
IDE/图形化开发工具	× 无，有VSCode插件	√
语法校验工具	√ IDE支持	√ IDE支持
TypeScript	√	√
Typing/自动补全	√ IDE支持	√ IDE支持
样式	scss/less/stylus自编译构建	scss/less/stylus

组件库/工具库/Demo

组件库/方案	Taro	uni-app
第三方组件	丰富	丰富
第三方工具库	丰富	丰富
Demo	丰富	较丰富
状态管理工具	Redux, Mobx, Dva	Vuex
转换微信小程序工具	√ 有	× 无
自研组件库	√ 有	√ 有
自动构建	√ 有	自建构建系统

实践反馈

支持宝小程序

不支持Swipe
不支持授权登陆

百度小程序

不支持个人开发注册appid

结果评审

评审意见：

xxx
xxxx
xxxxx

做出决定

我们最终决定选择XXX技术方案

参考文章

《小程序多端框架全面测评》