2021年，Flutter 与 React Native该如何选择？

????????关注后回复 “进群” ，拉你进程序员交流群????????

作者 | Wasim Charoliya

译者 | 王强

策划 | 田晓旭

2021 年，跨平台程序员之间关于 React Native 和 Flutter 的旷日持久的争论越来越白热化了。前几年，React Native 还是开发人员的首选框架，但是自 2017 年 Flutter 发布以来，其已经发展成为 React Native 的一个强有力竞争对手。

最近，随着许多初创公司选择了 Flutter 用于 MVP 开发，React Native 正在面临来自 Flutter 的激烈竞争。那么问题来了，哪种应用开发技术将在 2021 年取得成功呢？

Flutter 应用的优势

1. 热重载 = 快速编码

Flutter 允许开发人员使用一种更复杂、更快速的方式来创建应用程序。这是 Flutter 的最大优势之一，也是所有顶级移动应用开发公司都颇为看重的。

开发人员可以实时对代码库做出改进，并立刻看到这些改进反映在请求中。这就是所谓的“热重载”特性，更改通常只需几毫秒就能显示出来。

这一功能让团队可以快速添加功能、修复错误和测试新想法。此外，当团队需要通过协作来加快开发速度时，热重载用起来非常顺手。

2. 适用于多个移动平台的单一代码库

Flutter 允许开发人员为两个应用只编写一个代码库——一个针对 iOS，另一个针对 Android。因为 Flutter 具有自己的模板和布局，它的操作系统无关的平台意味着开发人员可以在两个不同的系统上使用相同的功能，同时保持每个应用都有自己独特的样式、可用性和功能。

Flutter for Web 是由谷歌开发的，为开发人员提供了必要的信誉保障。一旦应用程序上线，就可以用单个代码库支持 Android、iOS 和 Web 平台。

3. 与 React Native 相比，需要的测试只有一半

由于你将在两个平台上测试相同的程序，因此质量保证流程做起来会快得多。我们编写了的自动化测试量只有一半，因为在两个平台上可以编写相同的测试，这样就最大程度地减少了质量检查团队的工作量。

但是，由于你的质量检查专家必须手动检查每台设备上的应用，因此需要进行与原生编程相似级别的手动测试。

为什么有人会更喜欢 React Native 而不是 Flutter？

1. 快速刷新 = 快速编码

它具有与 Flutter 相同的特性。热重载加快了开发过程，并允许程序员将新代码直接插入正在运行的应用程序中。这样开发人员无需重新构建应用程序即可立刻看到改进。

热重载可以保留应用程序的状态，并避免了在完全重载期间丢失它的风险（就基于状态的框架而言，这是一大优势）——这进一步加快了移动应用程序成长的速度。

2. 一个代码库，两个移动平台（甚至更多！）

就像 Flutter 一样，你只需编写一个代码库即可运行两个应用程序，一个跑在 Android 上，一个运行在 iOS 上。更好的一点是，因为用的是 JavaScript，所以你在开发跨平台应用程序时可以和 Web 应用共享代码。你只需使用可对特定平台编译的抽象模块即可。

请参阅以下示例，了解可让你同时在 iOS 和 Android 及其他系统（包括 Web 和桌面应用）上编程的库：

React Native for Web 是一个跨平台应用，支持 Android、iOS 和 Web（Twitter 使用它来创建 Twitter Lite）。

ReactXp——Skype 开发的一个应用，支持 Android、iOS、互联网和 Windows 10（UWP）。

微软团队为所有 Windows 10 用户（PC、平板电脑、二合一、Xbox、混合现实设备等）创建了 React-native-windows。

React Native 程序员对事物的看法和采取的行动与大多数人是不同的。

你可以假设 Web 桌面应用、移动 Web 应用和原生应用都具有相同的业务逻辑，但是它们需要不同的 UI 才能满足不同的用户需求。

3. 它使用了流行的编程语言——JavaScript

React Native 使用的是 JavaScript 这种常用的编程语言，而 Dart 尚不为人所知。如果你是喜欢统计数据的开发人员，也可以使用 TypeScript（一个 JavaScript 的超集）。

4. 开发者的选择自由

开发人员可以使用 React Native 开发跨平台应用程序。

优势在于，React Native 允许你根据项目需求和开发人员的偏好来精确选择要使用的解决方案。

例如，如果开发人员需要处理全局状态（如何在单个应用程序中存储和管理多个组件使用的数据），则他们可以使用自定义用户界面库或编写自己的用户界面库；他们可以使用库路由器，或在 JavaScript 和 TypeScript 做出选择。

选择一种框架之前要考虑的事情

对很多人来说，Flutter 比 React Native 更难学习。React Native 在开发人员中很流行，因为它使用了 JavaScript 这种著名的编程语言。因此，如果你是 Dart 的新手，学习 Flutter 的时间可能比学习 React Native 的时间更长。但反之亦然：如果你以前曾用过 Dart，那么学习 Flutter 将会很容易。

由于 React Native 中的组件非常简单，因此设置它们的样式时你必须付出很多工作。只有少数几个模块可以识别平台，并且几乎都需要为 iOS 和 Android 应用不同的特性，或者设置不同的样式。

另一方面，Flutter 将组件视为小部件，此外，这些小部件基于 Material Design，所以可以高度自定义。大多数小部件都是自适应的，这意味着它们可以同时在 Android 和 iOS 上使用。

Flutter 在性能方面具有优势，因为它可以编译为 ARM 或 x86 原生资源，因此非常快。

React Native 只是原生方法的包装，也就是说它架起了一座桥梁，将某些调用转换为原生 API；当存在许多原生调用时，这就会成为瓶颈。

React Native 没有转换为原生代码，它还有 JavaScript 层，而渲染这些代码的性能要比 Flutter 低。这里有一些解决方法，但是 Flutter 就用不着操心这些，因为视图层就像游戏一样简单——而且，由于 Flutter 工程师构建了所有组件，因此对桥梁的原生调用更少，因为它们只是原生视图的包装。

使用 React Native 组件将无法获得足够的自定义能力。因此，如果有人选择不包装一个进程，就无法使用它（例如，视图周围的虚线框将不起作用）——并且来自谷歌和苹果的新组件需要很长时间才能出现在 React Native 中。

React 的 bug 修补也开始需要更长的时间。例如边界破裂问题，以及支持不同风味的问题，等等。大多数 React Native 公司正在制作定制的分叉来修复上游未修补的 bug。Flutter 开发人员更加谨慎，修复往往很快。到最后你可能把大部分时间花在 React Native 文档中，查找各种问题，试图找出事情没有按预期进行的原因。

总结

我们希望本文中的信息能帮助你确定以下问题的答案：“Flutter 还是 React Native，哪个更好？”就一般共识而言，谷歌的 flutter 将继续作为 SDK 存在，并且可能在未来几年内取代 React Native 的地位。如果在未来技术的重要性变得更大，那么在选择最佳解决方案的同时紧跟趋势是非常重要的。