移动端跨终端技术方案选型(思路)

需求目的

在移动互联网时代,应用平台愈来愈多,有 Android、iOS、H五、小程序、快应用等,而小程序目前又有不少服务商,好比微信小程序、支付宝小程序、百度小程序、头条小程序、QQ轻应用,
咱们的应用想要在用户能触达的平台和服务商中都能提供相应的产品服务,针对不一样的端去编写多套代码,作各端的应用,产品运营和开发成本显然很是高,这时候只编写一套代码就可以适配到多端的能力就显得极为须要,那有没有什么技术方案能够解决这个问题呢,让咱们能一次开发,统一配置,处处提供统一服务。web

多端统一技术方案是咱们想要寻找的,咱们须要寻找一套可靠、高效、一次开发,多端运行的优秀技术解决方案,来提高咱们产品上线的效率,下降实现的技术成本,以及达到最好的产品效果。小程序

结论总结

为此,咱们对业界流行的一些技术方案进行了调查和预研,经过各个维度的综合比较,作出方案选型结论以下:微信小程序

基于各个维度的综合比较,咱们最终决定选择 Taro 做为咱们多端统一技术方案选型。微信

Taro 是一套遵循 React 语法规范的 多端开发 解决方案。使用 Taro,咱们能够只书写一套代码,再经过 Taro 的编译工具,
将源代码分别编译出能够在不一样端(微信/百度/支付宝/字节跳动小程序、QQ轻应用、快应用、H五、React-Native (能够嵌入iOS,Android原生App,体验较好))运行的代码。app

依托 Taro 多端适配能力,丰富的自建组件库,强大的生态,活跃的社区,以及积极专业的开发者团队,能够保障咱们用很低的开发成本实现多端应用的统一。svg


考虑因素

项目因素

  • 项目规模,咱们的应用须要支撑x级用户的使用
  • 重要程度,xxx是咱们团队及部门目前最主要的产品突破点
  • 时间要求,目前xxx已经有不少产品需求,对于多平台的实验,技术实现时间上确定是越快越好
  • 须要支持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 MpVue wepy Chameleon
Android row 1 col 2
iOS row 2 col 2
H5 row 2 col 2
微信小程序 row 2 col 2
支付宝小程序 row 2 col 2
百度小程序 row 2 col 2
头条小程序 row 2 col 2
多端编译方式 row 2 col 2
跨端组件库 row 2 col 2

流行活跃度

流行度/方案 Taro uni-app MpVue wepy Chameleon
GitHub Star row 1 col 2
GitHub issue/PR row 2 col 2
NPM/CNPM 下载量 row 2 col 2
案例 row 2 col 2
开发者人数 row 2 col 2
自建开发者社区 row 2 col 2

开发工具

工具/方案 Taro uni-app MpVue wepy Chameleon
语法规范 row 1 col 2
IDE/图形化开发工具 row 2 col 2
语法校验工具 row 2 col 2
TypeScript row 2 col 2
Typing/自动补全 row 2 col 2
样式 row 2 col 2

组件库/工具库/Demo

组件库/方案 Taro uni-app MpVue wepy Chameleon
第三方组件 row 1 col 2
第三方工具库 row 2 col 2
Demo row 2 col 2
状态管理工具 row 2 col 2
转换微信小程序工具 row 2 col 2
自研组件库 row 2 col 2
自动构建 row 2 col 2

现状将来

现状/将来 Taro uni-app MpVue wepy Chameleon
现状 row 1 col 2
将来 row 2 col 2

对比结论:因为大厂支持下,Taro在生态和平台上都很是活跃,受普遍关注,而且基于开源社区的交流能让开发获得更即时的响应。
而uni-app在DCloud和Vue的官方推荐也有着普遍的应用场景,但使用QQ微信群的交流方式不利于寻找问题的答案,自建社区过于营销。工具

结果评审

评审意见:
多端支持:Taro > uni-app > Chameleon > mpVue > wepy
流行活跃度:Taro >mpVue > uni-app > wepy > Chameleon
开发工具: uni-app > Taro > wepy > Chameleon > mpVue
组件库/工具库/Demo: Taro > mpVue > uni-app > wepy > Chameleon性能

作出决定

基于以上各个维度的综合比较,咱们最终决定选择 Taro 做为咱们多端统一技术方案选型。学习

Taro 是一套遵循 React 语法规范的 多端开发 解决方案。使用 Taro,咱们能够只书写一套代码,再经过 Taro 的编译工具,
将源代码分别编译出能够在不一样端(微信/百度/支付宝/字节跳动小程序、QQ轻应用、快应用、H五、React-Native 等)运行的代码。开发工具

依托 Taro 多端适配能力,丰富的自建组件库,强大的生态,活跃的社区,以及积极专业的开发者团队,能够保障咱们用很低的开发成本实现多端应用的统一。

实践反馈

。。。

基本上技术选型按这个思路来,仍是比较有说服力的。

END.