关键词：
文章目录
概述
本文是记录我们在寻找多端统一技术方案选型的一个过程，也是我自己的一个思路。主要用来记录这个过程，结果并不重要，通过本次事件，让我能多方面考虑，综合思考，最终决定某项技术方案在团队的落地，这适用于所有的技术选型上以及在其他的事情上面，我们也应该学会多方位的思考，做到一件事的充分准备和有理有据，而不是说现在大家都怎么怎么样，我们就可以闭着眼睛这样去做，虽然最终结果我们还是跟闭着眼睛去选是一样的，但是这个思考的过程是很重要的，他让我们在别人提出质疑和疑惑的时候，有充分的准备来告诉对方，我们是慎重的一个决定，而不是随心所欲，随便做的。
需求目的
在设备多端，以及应用承载方式越来越多，各大平台技术孤立的时代，作为公司运营和技术开发团队，我们需要寻找一套可靠，优秀的技术解决方案，来提升我们开发实现产品的效率，降低实现的技术成本，以及达到最好的产品效果。
考虑因素
项目因素
- 项目规模，我们的应用需要支撑上百万用户的使用
- 重要程度，迅雷电影是我们团队及部门目前最主要的产品突破点
- 时间要求，目前迅雷电影已经有很多产品需求，对于多平台的实验，技术实现时间上肯定是越快越好
- 需要支持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 | √ | √ | |||
| iOS | √ | √ | |||
| H5 | √ | √ | |||
| 微信小程序 | √ | √ | |||
| 支付宝小程序 | √ | √ | |||
| 百度小程序 | √ | √ | |||
| 头条小程序 | √ | √ | |||
| 多端编译方式 | √ | 自研条件编译 | |||
| 跨端组件库 | √ | √ |
流行活跃度
| 流行度/方案 | Taro | uni-app | MpVue | wepy | Chameleon |
|---|---|---|---|---|---|
| GitHub Star | 16588 | 3734 | |||
| GitHub issue/PR | 382 | 54 | |||
| NPM/CNPM 下载量 | 4413 | ||||
| 案例 | 丰富 | 丰富 1万+ | |||
| 开发者人数 | ~5000 | ||||
| 自建开发者社区 | √ 有 | √ 有 |
开发工具
| 工具/方案 | Taro | uni-app | MpVue | wepy | Chameleon |
|---|---|---|---|---|---|
| 语法规范 | React, 类原生 | Vue | |||
| IDE/图形化开发工具 | × 无，有VSCode插件 | √ | |||
| 语法校验工具 | √ IDE支持 | √ IDE支持 | |||
| TypeScript | √ | √ | |||
| Typing/自动补全 | √ IDE支持 | √ IDE支持 | |||
| 样式 | scss/less/stylus自编译构建 | scss/less/stylus |
组件库/工具库/Demo
| 组件库/方案 | Taro | uni-app | MpVue | wepy | Chameleon |
|---|---|---|---|---|---|
| 第三方组件 | 丰富 | 丰富 | |||
| 第三方工具库 | 丰富 | 丰富 | |||
| Demo | 丰富 | 较丰富 | |||
| 状态管理工具 | Redux, Mobx, Dva | Vuex | |||
| 转换微信小程序工具 | √ 有 | × 无 | |||
| 自研组件库 | √ 有 | √ 有 | |||
| 自动构建 | √ 有 | 自建构建系统 |
实践反馈
支持宝小程序
- 不支持Swipe
- 不支持授权登陆
百度小程序
- 不支持个人开发注册appid
结果评审
评审意见：
- xxx
- xxxx
- xxxxx
做出决定
我们最终决定选择XXX技术方案
参考文章
多端统一开发解决方案---taro(代码片段)
Taro一套代码，多端运行，释放双手的摸鱼神器文章目录Taro一套代码，多端运行，释放双手的摸鱼神器1.简介2.准备工作2.1安装及使用2.1.1开发者工具2.1.2tarojs2.1安装tarojs工具3.Taro使用4.限制5.路由跳转汇总6.注意事项... 查看详情
传统企业如何打造统一的持续集成平台
一、传统行业打造统一持续集成平台痛点多团队维护多套工具链，重复任务多、运维成本高。各团队交付流程不统一么，重复造轮子，知识经验无法共享。各交付质量、标准不统一，难以形成统一的度量体系。二、从零到一的解... 查看详情
基于kubernetes的持续部署方案
...持续部署过程，在Kubernetes方案中，所有的Node节点均采用统一配置，根据业务环境的需求进行节点数量的控制。技术架构与选型Kubernetes集群部署模式：StackedetcdtopologyKubernetes的安装使用kubeadm安装为高可用集群，并选用Stackedetcdtopo... 查看详情
重构—技术方案选型
一、背景随着业务增长每天的订单量很快从30万单增长到了100万单，订单总量也突破了一亿。当时用的Mysql数据库。根据监控，每秒最高订单量已经达到了2000笔（不包括秒杀）。不过，直到此时，订单系统还是单库单表，幸好当... 查看详情
unity手游实战：从0开始slg—客户端技术选型
如何在立项前做好客户端的技术选型？腾讯资深开发工程师给你答案，一起来看这篇Unity手游实战：从0开始SLG—客户端技术选型。项目背景所谓选型，我认为就是为了实现某（些）个需求或者解决某（些）个问题所使用的解... 查看详情
taro，多端适配方案(代码片段)
...作者们的激情付出####介绍Taro是一套遵循React语法规范的多端统一开发框架多端统一开发框架，支持用React的开发方式编写一次代码，生成能运行在微信小程序、H5、ReactNative等的应用。Taro是一套遵循React语法规范的多端开发解决... 查看详情
多端统一开发框架taro优秀学习资源汇总awesome
多端统一开发框架Taro优秀学习资源汇总 https://github.com/NervJS/awesome-taro https://github.com/NervJS/taro/blob/master/CHANGELOG.md 查看详情
闲鱼前端基于serverless的一种多端开发解决方案
...多同学都在尝试解决这个问题，也催生了类似taro这样的多端统一开发框架，这是一个好的解决方案，但是比较被动，缺乏一定的扩展性。这篇文章我们要探讨的是，看能不能换个角度去解决这个问题，提升开发效率。ViewModel当... 查看详情
聊天服务器技术方案选型
现在需要做一个有聊天室集群，单个聊天室支撑同时在线600-800人的需求，选择一个什么样容易上手的方案比较好。 业务需求： 其他出发点： 单服聊天的需求比公会聊天的需求来得大的多，以满足单服聊天的承... 查看详情
架构师如何技术选型-全链路监控
...调研某公司的技术研发团队的现状监控埋点项目太多，不统一业务稳定性凝聚力不够大中台小前台微服务化高效和赋能人力资源匮乏结果和关系导向2.2技术选型技术选型范围:Openzipkin、Pinpoint、Incubator-skywalking、Lightstep、Appdash、Ja... 查看详情
技术选型总结(代码片段)
1.背景描述，遇到了什么难题2.遇到问题，然后就要开始寻找解决问题的办法那么去哪里找到解决方案了？回复：我常用的几个网站为博客园googleStackOverflow知乎csdn2.1找解决方案(可能会找到多个解决方案)2.2各个解决方案对比2.2.1... 查看详情
技术与方案的选型与思考
1、后端服务php为什么迁移到java？ 网上流传已久的“世界上最好的语言是php”，说实话，php基本上什么都能做，每个领域都能找到一些库。但是在性能上确实有一定的问题。 1、性能及格的服务端 性能上，... 查看详情
微服务-架构选型记录2022年微服务技术架构选型
后端技术栈套用互联网上的一句话，在java领域里面躲不过去的alibaba，所以本次微服务架构选型还是基于SpringCloudAlibaba做为基础。在SpringCloud众多的实现方案中，SpringCloudAlibaba凭借其支持组件最多，方案最完善... 查看详情
移动开发主流框架的选取以及技术选型方案解析
传统的移动开发模式主要分为三种，Native App，Web App 和 Hybrid App，对于目前微信端比较火爆的开发平台小程序，或者其他厂商推广的流应用、轻应用等开发方式，基本都离不开H5的支撑。目前App前端开发主流框... 查看详情
跨界！omi发布多端统一框架omip打通小程序与web腾讯开源2月28日
https://mp.weixin.qq.com/s/z5qm-2bHk_BCJAwaodrMIg跨界！Omi发布多端统一框架Omip打通小程序与Web腾讯开源 2月28日 查看详情
移动开发主流框架的选取以及技术选型方案解析
传统的移动开发模式主要分为三种，Native App，Web App 和 Hybrid App，对于目前微信端比较火爆的开发平台小程序，或者其他厂商推广的流应用、轻应用等开发方式，基本都离不开H5的支撑。目前App前端开发主流框... 查看详情
线上抓娃娃方案的选型方法
...因素，总结了一些经验，写成了本文。 线上抓娃娃的技术方案本质上是直播SDK加上物联网。选型直播SDK的方法就是要看延迟时间、流畅性、清晰度还有网页端的支持程度（H5版本），而选型抓娃娃方案的物联网部分就要看硬... 查看详情
移动端跨终端技术方案选型（思路）
需求目的在移动互联网时代，应用平台越来越多，有Android、iOS、H5、小程序、快应用等，而小程序目前又有很多服务商，比如微信小程序、支付宝小程序、百度小程序、头条小程序、QQ轻应用，我们的应用想要... 查看详情