移动端跨平台技术之下的变与不变

简介: ![Which-mobile-app-development-shall-be-fruitful-for-your-business.jpg](https://ata2-img.oss-cn-zhangjiakou.aliyuncs.com/7c4b99edd6896bd0a282faa3fea7fb5a.jpg) ## 一.跨平台,是想跨哪些平台? 目前(2020/7/18)来看,移

Which-mobile-app-development-shall-be-fruitful-for-your-business.jpg

一.跨平台,是想跨哪些平台?

目前(2020/7/18)来看,移动端跨平台需求主要集中在:

  • 跨 PC 端与移动端:PC 向无线过渡的早期,希望 PC Web 与移动 Web 复用同一套代码
  • 跨 Native 与 Web:商品详情页等要求有一套功能差不多的 Web 页能够在端外访问,需要跨 Native App 与 Web
  • 跨 Native 双端:出于开发效率等原因,希望 Android、iOS 双端复用一套业务代码
  • 跨 App:一些产品功能期望能在多个渠道投放上线,以工具类需求为主,如打车、买票、点餐

在可预见的未来,可能还会有这些跨平台需求:

  • 跨轻应用:系统级即用即走的轻量级应用,如Android 快应用iOS App Clips
  • 跨 IoT 设备:各种有显示屏的设备都会成为新的“端”,如车载设备、智能家居
  • 跨一切客户端:可能是伪需求,同一产品在不同平台的侧重点不同,或许并不需要把所有功能完整地搬到各式各样的客户端设备/平台渠道上,例如快应用与 Native App 的定位显然不一样

在这样的时代背景下,无论从资源成本、开发效率,还是从产品迭代、技术演进的角度来看,跨平台开发都是强需求,所以才有了层出不穷的各种跨平台方案探索

二.层出不穷的跨平台技术

细数近几年业界主流的移动端跨平台方案,可大致分为 3 类:

  • Web 生而跨平台:只要有浏览器或 WebView,依托 Web 技术即可轻松跨平台,如 Web App、PWA(Progressive Web Apps)、Hybrid App、PHA(Progress Hybrid App)
  • 容器化 Native 跨端:将 Native App 改造成标准化的容器,进而允许一套代码跨多端标准容器运行,如 React Native/Weex、Flutter
  • 小程序一码多投跨 App:国内市场中,越来越多的超级 App 支持了小程序,但各自的小程序框架并没有统一标准,于是有了Tarokboneuni-app等一系列跨小程序框架的方案来满足跨 App 投放产品功能的需求

跨平台:Web 与生俱来

610080-20200729084920708-1530798915.jpg

跨平台是 Web 与生俱来的优势,浏览器和 WebView 都是 W3C 规范下的标准化 Web 容器,因此 Web 页面能够轻松投放到端外浏览器、端内 WebView、以及其它 App 提供的 WebView 中

单从成本角度来看,Web 方案是跨平台的不二之选

  • 没有额外的学习成本:一套基础技术吃遍端内、端外、甚至 PC 浏览器、电视机顶盒
  • 不依赖特殊的配套设施:开发、调试、构建、发布、监控、运维等所有工程化环节都是通用的
  • 坐拥庞大的既有生态:npm 百万模块,应有尽有
  • Web 基于开放标准:走出去引进来都不是难事

并且,Web 本身就是一个平台,退可守,技术风险更低

但在另一些方面,依靠 Web 技术跨端也存在其局限性

  • 平台能力:受限于 Web 标准容器,无法满足平台能力相关的需求,如相机、蓝牙、多媒体等
  • 体验:移动端 Web 体验远不及 Native,主要体现在首屏加载慢、动画卡顿、长页滚动闪烁等场景
  • 性能:内存消耗大、GPU 利用率低

加上 Web 标准更迭慢,新特性兼容性差(如Push API过去许多年了,仍然无法放心使用),Web 基础能力难以满足 Native 端的需求。因此,在传统 Web App 的基础上,展开了更多的探索:

  • PWA(Progressive Web Apps):离线缓存、系统通知、主屏图标等类 Native App 能力加持之下的 Web App,但兼容性并不乐观
  • Hybrid App:Web 与 Native 混合的方案,将由 Native 实现的平台能力(比如扫描二维码)注入到 WebView 环境供 Web App 使用,以扩展 Web 的平台能力
  • PHA(Progressive Hybrid App):PWA 与 Hybrid 思想的结合,通过 Hybrid 手段让 Web 的性能和体验接近 Native

PWA 标准化似乎走不通,即便走通了能够真正放心用起来可能也是数年之后了。Hybrid App 解决了一部分问题(平台能力扩展),但还不够。PHA 是这两种思路的延续,借助 Native 技术实现 PWA 的梦想

但无论 PHA 还是 HA,引入 Native 依赖都意味着 Web 开放性的损失,继而带来跨端、跨 App 方面的问题

跨端:容器化 Native

reactflut-banner.jpg

除 Web 天然跨端之外,另一种统一多端的思路是将 Native 定制成标准容器,让同一份代码跑在一个个标准容器中,例如:

  • Android 容器:Native 壳 App
  • iOS 容器:Native 壳 App
  • Web 容器:Web Runtime

React Native 跨 Android、iOS、Web、Windows 四端,Weex 跨 Android、iOS、Web 三端,Flutter 以类似的方式跨 Android、iOS、Web、Linux 四端

从技术角度来看,RN 与 Weex 在 Native 容器中提供了 JavaScript 运行环境,以及布局引擎,渲染层都采用 Native 控件,因此 UI 交互上仍然存在系统差异。而 Flutter 方案更彻底一些,连渲染层也换成了基于图形引擎自绘 UI 控件,从而保证 UI 交互的跨端一致性

然而,由于容器化 Native 的方案是从 Native 出发,没有跨端天赋,除了要想办法支持 Web,还面临一个更难解决的问题——跨 App

跨 App:小程序一码多投

610080-20200729084957386-2122225581.jpg

技术视角下,小程序跨 Native App 仍然是依靠 Web 方案,那么,为什么不直接用 Web App 呢?

由于商业竞争等因素,闯入别人家地盘的 Web App 通常会遭到一些限制,如安全警告、权限控制、甚至干脆禁止访问(所以才有了口令分享等弯弯绕绕的方式)

小程序则不同,其初衷是开放的,欢迎大家入驻(当然,也要遵守规则),并且国内的许多大型 App 也都相继开放了小程序能力,小程序逐渐成为跨 App 的正规方式。但小程序平台多起来之后,框架标准不统一的问题也暴露了出来,都叫小程序,但都大同小异,于是,如何快速产出多种小程序变成了一个值得探索的技术课题

实现原理上分为两种,编译转换与运行时适配,前者能够达到等同于原生小程序的性能但带来了诸多限制(编译期难以识别的写法都不支持),现有的 Web App 不那么容易迁移成跨 App 小程序,例如 Taro、uni-app 等。后者牺牲性能换取了更多的可能性,现有的 Web App 能够相对容易地迁移过来,例如 Taro Next、kbone 等

P.S.当然,也可以有动静结合的思路,理想情况下,绝大多数基础业务走运行时平迁,个别高性能要求的部分走编译转换

三.重重变化之中,什么才是不变量?

渠道/端/平台、业务代码、工程化配套设施似乎都在快速地发生变化,没有哪个是稳定不变的

既然全都在变,就换个角度看,哪个部分一定会发生变化?

  • 容器:新的渠道/端/平台都是新的容器
  • 跨容器技术:新容器的出现,意味着新的跨容器技术要求

哪个部分是不必要跟着变的?

  • 业务代码:技术方案的更迭、新渠道/端/平台的出现,通常伴随着业务代码的迁移,Native 切 React Native 切 Flutter……乐此不疲,但从成本上看,业务代码并不一定也并不应该跟着变
  • 工程化配套设施:大多与技术栈强相关,例如 Web App 的开发、调试、构建、发布、监控、运维与 Native App 存在诸多差异,但其中更基础的部分是技术无关,而流程相关的,例如构建-发布流程、监控运维服务等并不需要跟着变
  • 容器中的平台能力:无论何种跨容器的方案,平台能力扩展需求都是一致的,对应的 Native 模块封装不应该跟着变

业务代码迁移的成本是非常高的(涉及技术栈变化时更痛),配套设施的推倒重建也绝对是大工程,那么,有没有办法把这些不应该跟着变的部分固定下来?

有,将变化的部分抽象出去。依赖抽象而不依赖具体,上层就不用跟着变了:

标准框架   \
---------  |  配套设施
标准容器   /

在这样的抽象模型下,上层业务代码依赖标准业务框架,而不直接依赖容器能力,从而允许业务框架以下的部分能够替换。业务框架依赖抽象的标准容器,而不与具体的特定容器相绑定,可替换为遵循容器标准的其它容器

基于标准框架,能够提供配套的脚手架、组件库、可视化搭建等配套开发工具。基于标准容器,能够建立性能诊断、事件追踪等配套调试能力,从而覆盖到工程化的整个链路,配套设施也几乎不用跟着变了

至于平台能力扩展,作为标准容器中的重要部分,也应该抽象出标准 API(类比浏览器提供的 BOM 系 API),供上层业务使用

四.跨平台技术的未来

预见不到未来,所以这里抛出几个可能性:

  • 移动跨端只跨 Native 两端:对许多移动产品而言,体验细腻、性能优异的 Native App 仍是目前最重要的应用形态,并且双端功能完全一致,同等重要,所以只跨 Android、iOS 两端,统一移动端 Native 开发是相对合理的方案
  • 小程序跨 App 自成一体:如果小程序不能真正标准化,跨 App 投放需求催生出的跨小程序框架方案就有必要存在
  • Web 仍是 Web,Hybrid 仍将持续:Web 特性更迭周期太长,移动设备的更迭太慢,等不及 Web 以年为单位的进化速度,依靠 Native 增强 Web 的 Hybrid 过渡方案很可能长期“过渡”下去

P.S.小程序已经在标准化进程中了,小程序框架成为标准化的容器也不是没有可能,毕竟小程序框架不存在 WebView、浏览器一样的慢周期阻力

不看好一招吃遍天下的跨全端的方案,因为无论 universal 组件还是 universal API 都是最小交集,无法满足实际需要。并且,真的需要让一套代码运行在所有渠道、端、平台上吗?

同一产品在不同平台的侧重点不同,或许并不需要把所有功能完整地搬到各式各样的客户端设备/平台渠道上,例如快应用与 Native App 的定位显然不一样

参考资料

相关文章
|
27天前
|
前端开发 开发工具 Android开发
移动应用开发的未来:跨平台工具与原生系统协同进化
随着移动互联网的蓬勃发展,移动应用已成为日常生活不可或缺的组成部分。本文深入探讨了移动应用开发领域的最新趋势,特别是跨平台开发工具的兴起以及它们如何与原生操作系统相互促进、共同发展。文章首先概述了移动应用开发的历史,然后详细分析了当前跨平台工具如Flutter、React Native等的优势和挑战,并探讨了这些工具对移动操作系统生态的潜在影响。最后,文章预测了未来移动应用开发可能的发展方向,以及开发者和企业在面对不断变化的技术环境时所需采取的策略。
25 8
|
29天前
|
开发框架 Dart 前端开发
移动应用的未来与跨平台开发技术
【2月更文挑战第30天】 随着移动互联网的迅猛发展,移动应用已成为人们日常生活和工作的重要组成部分。本文将探讨当前移动应用开发领域的趋势、挑战以及跨平台开发技术的影响力。文章首先分析了移动应用市场的现状和用户需求的变化,随后详细介绍了跨平台开发框架的原理和优势,并通过案例分析阐述了如何利用这些技术开发高效、兼容多平台的移动应用。最后,文章展望了未来移动应用开发可能的发展方向,并讨论了开发者应如何适应这一趋势。
|
移动开发 Dart 前端开发
【技术干货】移动端跨平台技术发展
移动端跨平台技术一直在寻求研发效率动态性与性能体验间的平衡,本文归纳总结Hybrid技术、React Native技术、Flutter、小程序的技术演进与未来趋势。
2206 0
|
2天前
|
机器学习/深度学习 开发框架 前端开发
移动应用开发的未来:跨平台框架与原生系统之争
【4月更文挑战第17天】 在数字化时代的浪潮中,移动应用已成为连接用户与技术的桥梁。随着移动设备种类的多样化及用户需求的个性化,移动应用开发正面临着一场技术革新。本文将探讨当前移动应用开发的热点——跨平台开发框架与原生操作系统之间的竞争与协同,分析两者各自的优势、局限以及未来发展趋势,为开发者和企业提供深入见解。
|
10天前
|
前端开发 Android开发 开发者
探索移动应用开发的未来:跨平台工具与原生系统的挑战
【4月更文挑战第9天】 在移动计算的时代,应用开发正经历着前所未有的变革。本文将深入探讨移动应用开发的新趋势,特别是跨平台开发工具的兴起以及它们如何影响着原生操作系统的应用生态。我们将分析跨平台工具如React Native和Flutter所带来的便利性,同时考察它们在性能、用户体验和系统整合方面所面临的挑战。此外,文章还将探讨移动操作系统的最新发展,包括它们如何处理多任务、安全性问题以及如何为未来的创新铺平道路。通过本文,读者将获得对移动应用开发现状及未来方向的深刻理解。
|
20天前
|
开发框架 前端开发 JavaScript
移动应用开发的未来趋势:跨平台框架与原生系统整合
随着移动互联网的迅猛发展,移动应用已成为日常生活和商业活动中不可或缺的组成部分。本文将探讨移动应用开发领域的未来发展趋势,重点关注跨平台开发框架的兴起以及它们如何与原生移动操作系统进行整合。我们将分析Flutter、React Native等流行框架的技术特点,并讨论它们在提高开发效率、降低成本和优化用户体验方面的潜在优势。文章还将预测这些技术如何塑造未来移动应用开发的方向,为开发者和企业提供前瞻性的指导。
21 4
|
21天前
|
前端开发 开发工具 Android开发
移动应用开发的未来:跨平台工具与原生系统的挑战
随着移动设备成为日常生活的延伸,移动应用的发展也迎来了前所未有的挑战与机遇。本文将探讨移动应用开发领域的最新趋势,包括跨平台工具的优势、移动操作系统的最新进展,以及开发者如何应对不断变化的技术环境。我们将重点分析Flutter和React Native等跨平台解决方案,并深入讨论Android和iOS系统在性能优化、安全性强化方面的最新创新。文章旨在为开发者提供一个全面的技术框架,帮助他们在构建下一代移动应用时做出明智的选择。
14 1
|
23天前
|
前端开发 Android开发 开发者
移动应用开发的未来:跨平台技术与原生系统的融合
随着移动互联网的蓬勃发展,移动应用已成为日常生活不可或缺的一部分。本文将深入探讨移动应用开发的新趋势——跨平台技术的崛起以及它与原生系统之间的融合。我们将分析当前市场上流行的跨平台框架,如React Native和Flutter,并讨论它们如何优化性能以匹敌原生应用。同时,我们也将着眼于移动操作系统的最新进展,特别是Android和iOS在兼容性、安全性和用户体验方面的创新。通过对未来技术趋势的预测,本文旨在为开发者和企业提供洞见,以便他们在不断变化的市场中保持竞争力。
|
29天前
|
开发工具 vr&ar Android开发
移动应用开发的未来:跨平台工具的崛起与移动操作系统的演变
【2月更文挑战第30天】 随着移动互联网的不断演进,移动应用开发已经从单一平台的专属开发模式,转向了跨平台、高效率的开发策略。本文将深入探讨跨平台移动应用开发工具的兴起,以及它们如何影响移动操作系统的发展。同时,我们还将分析移动操作系统的最新趋势,包括它们如何适应这些开发工具和市场需求的变化。通过对未来技术的前瞻性展望,我们希望为开发者和企业提供有价值的洞察,帮助他们在竞争激烈的移动市场中保持领先。
|
29天前
|
开发工具 UED 开发者
移动应用开发的未来:跨平台与原生之争
【2月更文挑战第30天】随着移动设备成为我们生活中不可或缺的一部分,移动应用开发也成为了软件工程的一个重要分支。本文将探讨移动应用开发的两大主流策略——跨平台开发和原生开发,以及它们在未来的发展趋势。