热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

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

需求目的在移动互联网时代,应用平台越来越多,有Android、iOS、H5、小程序、快应用等,而小程序目前又有很多服务商,

需求目的

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

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

结论总结

为此,我们对业界流行的一些技术方案进行了调查和预研,通过各个维度的综合比较,做出方案选型结论如下:

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

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

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



考虑因素


项目因素


  • 项目规模,我们的应用需要支撑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

详细对比


多端支持


多端/方案Tarouni-appMpVuewepyChameleon
Androidrow 1 col 2
iOSrow 2 col 2
H5row 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

流行活跃度


流行度/方案Tarouni-appMpVuewepyChameleon
GitHub Starrow 1 col 2
GitHub issue/PRrow 2 col 2
NPM/CNPM 下载量row 2 col 2
案例row 2 col 2
开发者人数row 2 col 2
自建开发者社区row 2 col 2

开发工具


工具/方案Tarouni-appMpVuewepyChameleon
语法规范row 1 col 2
IDE/图形化开发工具row 2 col 2
语法校验工具row 2 col 2
TypeScriptrow 2 col 2
Typing/自动补全row 2 col 2
样式row 2 col 2

组件库/工具库/Demo


组件库/方案Tarouni-appMpVuewepyChameleon
第三方组件row 1 col 2
第三方工具库row 2 col 2
Demorow 2 col 2
状态管理工具row 2 col 2
转换微信小程序工具row 2 col 2
自研组件库row 2 col 2
自动构建row 2 col 2

现状未来


现状/未来Tarouni-appMpVuewepyChameleon
现状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轻应用、快应用、H5、React-Native 等)运行的代码。

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

实践反馈

。。。

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

END.


推荐阅读
  • Google Play推出全新的应用内评价API,帮助开发者获取更多优质用户反馈。用户每天在Google Play上发表数百万条评论,这有助于开发者了解用户喜好和改进需求。开发者可以选择在适当的时间请求用户撰写评论,以获得全面而有用的反馈。全新应用内评价功能让用户无需返回应用详情页面即可发表评论,提升用户体验。 ... [详细]
  • 知识图谱——机器大脑中的知识库
    本文介绍了知识图谱在机器大脑中的应用,以及搜索引擎在知识图谱方面的发展。以谷歌知识图谱为例,说明了知识图谱的智能化特点。通过搜索引擎用户可以获取更加智能化的答案,如搜索关键词"Marie Curie",会得到居里夫人的详细信息以及与之相关的历史人物。知识图谱的出现引起了搜索引擎行业的变革,不仅美国的微软必应,中国的百度、搜狗等搜索引擎公司也纷纷推出了自己的知识图谱。 ... [详细]
  • 恶意软件分析的最佳编程语言及其应用
    本文介绍了学习恶意软件分析和逆向工程领域时最适合的编程语言,并重点讨论了Python的优点。Python是一种解释型、多用途的语言,具有可读性高、可快速开发、易于学习的特点。作者分享了在本地恶意软件分析中使用Python的经验,包括快速复制恶意软件组件以更好地理解其工作。此外,作者还提到了Python的跨平台优势,使得在不同操作系统上运行代码变得更加方便。 ... [详细]
  • Question该提问来源于开源项目:react-native-device-info/react-native-device-info ... [详细]
  • Vue基础一、什么是Vue1.1概念Vue(读音vjuː,类似于view)是一套用于构建用户界面的渐进式JavaScript框架,与其它大型框架不 ... [详细]
  • React 小白初入门
    推荐学习:React官方文档:https:react.docschina.orgReact菜鸟教程:https:www.runoob.c ... [详细]
  • Android Studio Bumblebee | 2021.1.1(大黄蜂版本使用介绍)
    本文介绍了Android Studio Bumblebee | 2021.1.1(大黄蜂版本)的使用方法和相关知识,包括Gradle的介绍、设备管理器的配置、无线调试、新版本问题等内容。同时还提供了更新版本的下载地址和启动页面截图。 ... [详细]
  • 拥抱Android Design Support Library新变化(导航视图、悬浮ActionBar)
    转载请注明明桑AndroidAndroid5.0Loollipop作为Android最重要的版本之一,为我们带来了全新的界面风格和设计语言。看起来很受欢迎࿰ ... [详细]
  • Google在I/O开发者大会详细介绍Android N系统的更新和安全性提升
    Google在2016年的I/O开发者大会上详细介绍了Android N系统的更新和安全性提升。Android N系统在安全方面支持无缝升级更新和修补漏洞,引入了基于文件的数据加密系统和移动版本的Chrome浏览器可以识别恶意网站等新的安全机制。在性能方面,Android N内置了先进的图形处理系统Vulkan,加入了JIT编译器以提高安装效率和减少应用程序的占用空间。此外,Android N还具有自动关闭长时间未使用的后台应用程序来释放系统资源的机制。 ... [详细]
  • 本文介绍了RxJava在Android开发中的广泛应用以及其在事件总线(Event Bus)实现中的使用方法。RxJava是一种基于观察者模式的异步java库,可以提高开发效率、降低维护成本。通过RxJava,开发者可以实现事件的异步处理和链式操作。对于已经具备RxJava基础的开发者来说,本文将详细介绍如何利用RxJava实现事件总线,并提供了使用建议。 ... [详细]
  • React基础篇一 - JSX语法扩展与使用
    本文介绍了React基础篇一中的JSX语法扩展与使用。JSX是一种JavaScript的语法扩展,用于描述React中的用户界面。文章详细介绍了在JSX中使用表达式的方法,并给出了一个示例代码。最后,提到了JSX在编译后会被转化为普通的JavaScript对象。 ... [详细]
  • 本文介绍了互联网思维中的三个段子,涵盖了餐饮行业、淘品牌和创业企业的案例。通过这些案例,探讨了互联网思维的九大分类和十九条法则。其中包括雕爷牛腩餐厅的成功经验,三只松鼠淘品牌的包装策略以及一家创业企业的销售额增长情况。这些案例展示了互联网思维在不同领域的应用和成功之道。 ... [详细]
  • 本文详细介绍了Android中的坐标系以及与View相关的方法。首先介绍了Android坐标系和视图坐标系的概念,并通过图示进行了解释。接着提到了View的大小可以超过手机屏幕,并且只有在手机屏幕内才能看到。最后,作者表示将在后续文章中继续探讨与View相关的内容。 ... [详细]
  • mui框架offcanvas侧滑超出部分隐藏无法滚动如何解决
    web前端|js教程off-canvas,部分,超出web前端-js教程mui框架中off-canvas侧滑的一个缺点就是无法出现滚动条,因为它主要用途是设置类似于qq界面的那种格 ... [详细]
  • RN即ReactNative基于React框架针对移动端的跨平台框架,在学习RN前建议最好熟悉下html,css,js,当然如果比较急,那就直接上手吧,毕竟用学习前面基础的时间,R ... [详细]
author-avatar
卡农的信仰144
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有