是什么让 React Native 适合 Uber Eats 和其他在线食品配送应用程序?

已发表: 2021-12-07

优步有义务为其客户提供比传统更多的服务,无论其领域是什么。 虽然推出在线食品配送应用 UberEats 的计划正在筹备中,但该公司致力于使其成为一种非凡的体验,就像 UberPOOL 和 UberX 一样。

开发人员团队意识到了行业现有的挑战,例如接送过程中涉及的额外步骤,无法与交付专业人员进行实时沟通,以及与所有三个垂直领域(客户、餐厅和交付人员)建立持续的沟通的人员。

最终,在 React Native 的帮助下,UberEats 应运而生。 在这篇文章中,我们将解释 Reach Native 的使用如何帮助 Uber 塑造应用程序。

了解 React Native

在计算机上工作的开发人员
图片:不飞溅

RN 或 React Native 是全球公认的移动应用程序开发框架,用 JavaScript 编写。 使用 React Native,可以进行原生 iOS 和 Android 移动应用程序的开发。 各种平台的应用程序开发将使用相同的代码库完成,这会带来巨大的努力和节省时间。

React Native 由 Facebook 和相关社区生成,于 2015 年作为开源工具提供。开发后不久,由于其无与伦比的易用性和扩展的可用性,它成为混合和移动解决方案开发中使用的标准源。 此外,一次编写的代码可以轻松用于 iOS 和 Android 应用程序开发。

它在开发人员中变得如此突出,超过 42% 的人正在使用它。 事实上,Skype、Facebook 和 Instagram 等现代应用程序的出现只是因为 React Native。

挑战

开发移动应用程序已经是一项充满挑战的工作,而 Uber 的主要挑战是缺乏开发移动应用程序所需的足够技术堆栈,因为该团队仅处理 Web 应用程序开发,由三方组成。 开发这样一个应用程序需要一个仪表板,它不应该局限于网络,可以进入餐馆,并从餐馆传输关键信息。

基于现有知识,Uber 构建了该应用程序的原型。 但是,它缺少上述所有功能。 此外,没有声音通知极大地损害了最终用户的体验,因为食客无法获得实时订单更新。

原始的 Restaurant Dashboard 与 Web 兼容,并为平板设备提供了一个 React/Flux 页面,当时授予对有限设备的访问权限。 餐厅仪表板容量的减少迫使优步与餐厅的沟通受到限制。

这种受控通信的最简单示例之一是最终用户必须与网页通信以支持基于声音的通知提示。 餐厅员工没有收到关于收到新订单、送货人员到达以进行订单拣选和最终送货的实时更新。

除此之外,之前版本的 UberEats 只允许使用兼容 AirPrint 的打印机打印实体收据给餐厅。

React Native 让事情变得更好

超级吃
图片:不飞溅

开发团队不知道如何构建 iOS/Android 应用程序。 但是,React 被掌握了。 因此,为 Uber Eats 选择 React Native 是肯定的。 它是用于 Uber Eats 的庞大技术堆栈的关键部分。 它与 Uber 的现有基础设施相得益彰,并允许团队访问他们在本地移动应用程序开发中寻找的功能。

在推出功能齐全的应用程序之前,Uber 决定推出一个演示版本,其中应包括以下关键部分:

  • 应用程序崩溃报告
  • 最终用户的详细分析
  • 应用程序下载本机依赖项的能力
  • 用户认证

根据公司报告,该演示成功地带来了预期的结果,因为开发团队发现崩溃报告比预期的效果更好。JavaScript 桥接像触发分析事件这样的设施是无缝的,并且观察应用程序的业务逻辑很容易。

应用程序架构重新定义

React Native 帮助 Uber 融合了移动和 Web 应用程序开发,同时允许在原生或 JavaScript 中生成功能。 由于这种互操作性,Uber 的开发人员也能够在移动应用程序开发中利用他们的 Web 应用程序开发专业知识。

他们以与惯用的 React /Redux Web 应用程序非常相似的方式设计 Uber Eats,同时根据时间的需要保持 iOS 模式和模块模式。 React Native 的使用允许 Uber 增强应用程序的路由功能。

虽然 Uber Eats 只是基于 Web 的,但 Restaurant Dashboard 使用的是著名的 react-router 库。 使用该库,应用程序的路由以声明方式进行解释,就像视图一样。 此类应用程序路由仅支持 URL,其可访问性在浏览器之外是不可能的。

React Native 的使用为开发人员提供了一个与 UINavigationController 非常相似的精确导航库。 像 NavigationExperimental 或 Navigator 这样的 React Native 库使 Uber 的开发团队能够轻松地从reach-router 迁移。 Vanillareach-router 是应用程序路由的绝佳资源,因为它几乎不会受到应用程序架构的阻碍。

在移植过程进行时,开发团队了解到,在将逻辑放在 JavaScript 层中的同时减少 iOS 和 JavaScript 之间的交互是明智之举。 这一举措在很多方面都有帮助。 例如,最终应用程序的功能较少。

JavaScript 和 Objective-C 切换以获得更好的可移植性,并减少错误发生的几率。 使用 n Reach Native,Uber Eats 开发团队提出了一个简单的通信 API,可以在各个级别进一步使用。

增强推送更新/通知

mac 应用程序
图片:堆栈社交

由于使用该技术构建的应用程序与一小块 Objective-C/Java 代码链接在一起,因此 Web 应用程序的声音通知功能不可用 React Native 得到了遏制。 这些代码组合在一起构建了一个庞大的捆绑包,该捆绑包随后像资产一样随应用程序一起分发。 当存在原生层时,应用程序能够更改 React Native 桥文件并请求重新加载。

在本机层,应用程序可以更改 React Native 桥使用的文件并请求重新加载它。 错误的更新(在 Uber Eats 中被称为引起问题的捆绑包)可能会强制停止餐厅仪表板。 它可能发生在逻辑包生效之前。 此类糟糕的更新可能随时出现并导致餐厅仪表板崩溃。

开发团队通过将每个版本都视为试验来解决此问题,以便逐步推出。 React Native 中提供的独特 javascript 包会在加载任何推送的包后自动加载。

把它包起来

Uber Eats 有一段有趣的旅程,而 React Native 在整个旅程中都发挥了关键作用。 这项技术帮助开发团队获得了一些值得称道的专业知识和功能,用于本地应用程序开发,以改善用户体验。

它为餐厅仪表板的升级带来了最大的革命性变化。 它使这个操作方面得到授权、无缝和高度响应。 这个框架确实在不增加复杂性的情况下增强了应用程序的功能。 尽管 React Natives 在 UberEats 庞大的技术堆栈中只占一小部分,但它的贡献是值得称道的。

如果您打算开发像 UberEats 这样的在线食品配送应用程序,请考虑使用 React Native。 聘请 React Native 开发人员或团队将您的项目想法变为现实。 下注不会让任何人失望。

编者按: Chandresh Patel 是 Bacancy Technology 的 CEO、敏捷教练和创始人。 他真正的企业家精神、熟练的专业知识和在敏捷软件开发服务方面的广泛知识帮助该组织达到了新的成功高度。

对此有什么想法吗? 在下面的评论中让我们知道,或者将讨论带到我们的 Twitter 或 Facebook。

编辑推荐: