沃尔玛如何使用 React Native 开发 iOS 和 Android 应用

2020年1月16日 351点热度 0人点赞 0条评论

作者 | Sergio De Simone

译者 | 刘雅梦

在过去的两年里，沃尔玛（Walmart）的工程师们一直在稳步地将 React Native 集成到他们的移动开发工具箱中 [1]。他们并没有选择纯粹的 React Native 应用程序，而是选择了一款充分利用原生和 React 最佳特性的混合应用程序。

为 iOS 和 Android 构建移动应用程序有好几种方法。我们可以选择采用两个完全独立的原生实现，完全不共享任何代码；我们也可以使用 Flutter、 React Native、Ionic 或 Xamarin 来进行跨平台开发，实现只有一个代码库的目的；或者，我们可以构建一个混合应用程序，其中一部分是原生的，另一部分是使用跨平台开发框架构建的。每种方法都可以在成本和收益之间取得平衡，不存在某种解决方案对所有情况来说都是最佳的。

虽然采用混合应用程序的方法看起来是最明智的，但是如果我们选择了错误的技术，那么构建一个共享公共代码库的混合应用程序可能会产生隐性成本 [2]，这甚至会比构建两个独立的原生应用程序还要昂贵。相反，巧妙地将原生与跨平台技术混合使用可以帮助我们取得适当的平衡，并获得良好的开发性能。

这正是沃尔玛采用 React Native 为 Android 和 iOS 重写部分现有应用程序时遇到的情况。沃尔玛的工程师表示，正是因为采用了这种方法，他们将开发速度提高了一倍；不仅可以在移动应用程序之间共享业务逻辑，而且还可以与他们的 React/Redux Web 应用程序共享业务逻辑；可以利用开发人员在 Web 技术方面的经验来构建移动功能；并利用即时页面重新加载和空中（OTA）代码推送来修复关键问题。

沃尔玛方法的一个关键组成部分是它自己的 Electrode 平台，以及它的“同胞兄弟” Electrode Native。

为了在任何软件迁移项目中都能取得成功，拥有三个 T 是很重要的：团队（Team）、工具（Tools）和韧劲（Tenacity）。我们已经有了一个小型的 React 开发团队，他们深入移动应用程序领域并热爱它。我们需要一个工具来帮助我们将 RN 页面集成到原生应用程序中，并为我们提供一种能在 JavaScript 和原生应用程序之间进行通信的标准方式。

Electrode Native 允许使用 AAR 文件或框架在现有的移动应用程序中集成 MiniApp。MiniApp 就是 React Native 应用程序，它能够通过自动生成的 JavaScript、Java 或 Swift API 与应用程序的其它部分进行通信。此外，Electrode Native 应用程序可以使用集中式文档数据库来共享移动应用程序版本、原生依赖关系以及 MiniApp 应用程序相关的信息。

沃尔玛工程师采取的另一个有利的设计决策是使用原生导航，而不是 React Native 的导航系统。这使得在现有视图堆栈中一个接一个地将新页面与原生动画和速度集成成为可能。

此外，在现有导航堆栈中嵌入新页面可以更容易地使用 A/B 测试来了解客户对新特性的反应，并且有时还可以通过禁用 React Native 页面来应对一些问题。

目前，沃尔玛移动应用程序几乎完全是由 React Native 来提供支持的，但这两个应用程序仍将保持混合模式，并利用原生平台进行更好的集成。原始文章中还包含了更多的其他详细信息，比如相关的组织挑战以及沃尔玛是如何克服这些挑战的。