开发跨平台app推荐React Native还是flutter?

49次阅读

共计 2919 个字符,预计需要花费 8 分钟才能阅读完成。

嗯。。。这个问题十分不好回答啊 (捋下鱼须)。闲鱼作为 flutter 领域的先驱者,以及 fish_redux、flutter_boost 等当红 flutter 库的作者,当然是欢迎广大的开发者多多使用 flutter 相关技术栈 逃~:)。咳咳,不过呢,我们还是正经得聊一下 React Native(下面简称 RN) 和 flutter 之前的异同:
0x00 简单介绍一下
React Native
React Native 是 Facebook 开源的一款基于 react 思想、使用 JS、能够给移动平台带来 native 般体验的框架,官网最新的版本是 0.5.9。
flutter
flutter 来自 Google,上层使用 dart 语言构建跨平台应用,通过平台相关的 embedded 层接入到使用 c ++ 编写的 engine 层,再通过 skia 库直接与 GPU 进行交互。通过对 dart 代码的 AOT 编译,拥有优异的计算 (CPU)、渲染(GPU) 性能。官网最新的版本为 1.2。
0x01 跨平台性
开发者们使用跨平台技术栈,首要的目的是为了能够省事儿,所以跨平台能力是首先要被衡量的指标。
Build native mobile apps using JavaScript and React
这意味着开发者可以复用庞大的 JavaScript 生态和优雅的 react 思想来书写 RN 的代码,给开发提供很多的便利性。
从实现原理上来说,RN 进行完排版之后会把最终的渲染交给 native view,这种方式带来的是如 native 般的 UI 性能,但同时也给给平台一致性带来了一些问题。除开渲染层的不一致,在 iOS 和 Android 没有使用同一个 JavaScript 虚拟机也会带来一些暗坑。
手势的处理上两个平台不好统一,RN 官方也没有提供一个抹平差异的库,虽然开源社区有 react-native-gesture-handler。
Beautiful native apps in record time
flutter 官方的口气很大,说自己是”空前“的。是不是”空前“,我们得来评估一下。
编程语言层面,flutter 使用 dart 语言构建应用,这门语言对大多数人来说应该是比较陌生,好在 dart 的语法并不复杂,与 Java 等强类型 oop 语言非常相似,还加入了函数式的特性,使用起来还是挺方便的。
flutter 提供类似 React 思想的响应性 UI 编程模型,让 UI 开发变得更加 fancy。
原理上来说,flutter 在各个平台上使用统一的 vm(dart vm),自带 GDI(skia)。skia 是一个已经发展多年成熟度相当高的 2D 图形库,也是 Android 系统和 Chrome 一直在使用的图形库。
flutter 从逻辑计算到渲染绘图,都是自己的,使得它在跨平台一致性上有良好的表现。dart 提供的 AOT 特性也可以保证应用在线上有一个好的性能表现。
多平台支持
RN 目前支持 iOS 和 Android 两个平台,另外有个非官方的 ReactNativeX 的项目旨在让 RN 运行到其他平台。
flutter 早期支持 iOS 和 Android,desktop 的支持目前尚不完善。近期 flutter 团队发布了 Hummingbird,旨在让 flutter 编写的应用可以运行在浏览器端。
从多平台支持的角度看,两边差距不大。相比 RN,flutter 在 desktop 的支持上有些优势,但目前都是不怎么可用状态。
0x02 开发便利性
工具链
RN 在打包发布方面有被前端广泛使用的 webpack 支持,官方自己提供了基于浏览器的 debug 工具,与前端同学管用的调试方式并无二致。
flutter 基于 iOS 和 Android 已有的打包工具添加了 flutter 产物打包功能,同样 debug 工具也由官方自己提供,除了刚发布的基于浏览器的调试工具外,flutter 团队提供的调试工具可以直接在 Android Studio 或者 VScode 这类 IDE 上直接使用。
调试便利性
JS 的调试方式已经很成熟了,这里不多做展开。flutter 在 debug 阶段可以使用集成于 IDE 插件中的 hot reload 功能做到亚秒级的新代码加载速度,十分适合与设计师坐在一起结 (ya) 对(li)编 (tiao) 程(shi):)。
第三方库
在 RN 上你可以使用 JS 的大部分库,平台相关的 plugin 也相对丰富。
flutter 在这方面稍显欠缺,库的数量上无法与 JS 生态相比较。flutter/plugins 项目提供了大量的平台相关插件供开发者使用,倒也是满足了日常开发的需求,另外 dart pubs 上的公开库数量也日趋上升。
在混合开发和大型 app 业务框架上,闲鱼技术开源的 flutter_boost 提供了与 native 混合开发的可能,而 fish_redux 使得大型 app 中的复杂页面的开发在 flutter 中变得更加容易。
0x03 未来的发展
开发者选择一个技术,都是压了”身家性命“在上面,谁也不想刚入门就发现这门技术即将被淘汰。
RN 是个很好的项目,在发布之初给移动开发带来了一阵旋风。但不得不说,Airbnb 宣布放弃使用 RN 技术栈对于整个社区有不小的打击,而文章中对原因的阐述也相当有说服力。
flutter 在 1.0 发布之后趋于成熟,被钦定为 Google Fuchsia 系统的应用层框架。从团队 2019 roadmap 中可以看到,flutter 当前重点在于完善一些现有功能上的细节与 bugfix,另外对于广受期待的动态化特性,flutter 团队也在开发 code push 功能。从 flutter 团队目前的方向和笔者在闲鱼开发中实际使用的 flutter 的感受来看,整体上 flutter 在框架层面目前已经基本上稳定。
从桌面端跨平台框架发展的历程来看,Java GUI 从最初使用 peer(对等设计模式)的 AWT,到基于 Java 图形绘制接口性能巨慢无比的 Swing,再到公认性能最好目前应用最广泛的基于目标平台绘制接口的 SWT,我们可以从中窥见一些历史规律。
peer(对等设计模式),即 AWT 中的一个控件,对应目标平台 (如 Windows) 上的一个控件(是不是看起来跟 RN 有一些相似),最终 AWT 被放弃是因为 peer 模式传输层级过多造成效率低下,GUI 部分为了保证可移植性只能保留各个平台公共的接口。
SWT 与 QT(另一个被广泛使用的桌面端跨平台 GUI 框架),牺牲了一部分可移植性(主要是因为直接调用了目标平台的图形绘制接口),带来了 GUI 的高性能。flutter 也采用了类似技术栈,skia 来抹平各个平台的绘制接口差异,并向上提供统一的图形接口。
从这个角度来说,无疑 flutter 可能会是一个更有未来的跨平台框架。
0x04 写在最后
当然 Facebook 官方对于 RN 正在进行重构,包括把大部分逻辑移动到 c ++ 层来减少线程切换的开销提升性能等。
选择一个框架需要考虑的实际情况比框架的优劣比较更加重要,比如你的项目大小、开发人员构成等,RN 和 flutter 作为目前移动平台上炙手可热的框架,两者并不是孰优孰劣的对立关系。
纸上得来终觉浅,如果你是个对新技术感兴趣,抑或是希望在移动平台上有所突破的开发者,何不尝试一下 Google 最新的成果咧?

本文作者:闲鱼技术 - 海猪阅读原文
本文为云栖社区原创内容,未经允许不得转载。

正文完
 0