Airbnb 的 React Native 历程（一）：开篇

转载请注明出处。请前往 Tiga on Tech 查看原文以及更多有趣的技术文章。

原文链接：https://medium.com/airbnb-engineering/react-native-at-airbnb-f95aa460be1c

我们将在这个系列的 5 篇文章里，讲述 Airbnb 使用 React Native 进行移动端开发的历程，以及在放弃 React Native 之后的计划。这是这个系列文章的第 1 篇。

This is the first in a series of blog posts in which we outline our experience with React Native and what is next for mobile at Airbnb.

在 10 年前（本文发表于 2018 年 6 月），Airbnb 网站上线的时候，智能手机还处于发展初期。从那时候开始，智能手机迅速发展，成为了我们日常生活里必不可少的工具，尤其是当越来越多的人开始周游世界。Airbnb 作为一个为上百万用户新型的旅行方式的社区，需要拥有一个世界级别的移动端 APP。当人们出门在外的时候，移动设备通常是他们首要的，甚至是唯一的沟通工具。

When Airbnb launched 10 years ago, smartphones were in their infancy. Since then, smartphones have become an essential tool to navigate our everyday lives, especially as more and more people travel around the globe. As a community that enables new forms of travel for millions of people, having a world-class app is crucial. Mobile devices are oftentimes their primary or only form of communication while away from home.

2008 年，3 位房客入住了位于旧金山 Rausch 街的 Airbnb 房源，从那以后，来自 Airbnb 移动端的预定从 0 增长到了每年数百万。我们的移动端 APP 允许房东随时随地管理他们的房源，以及让旅客在手机上动动手指就能够发现好的住宿地点和体验。

Since our first three guests stayed in Rausch Street in 2008, mobile usage has increased from zero to millions of bookings per year. Our apps give hosts the ability to manage their listings on the go and provide travelers with inspiration to discover new places and experiences right at their fingertips.

为了适应移动端 APP 用户的快速增长，我们的团队成长为一个拥有超过 100 名移动端工程师的团队，以便我们能够为移动端用户提供更多新的体验，以及提升现有的体验。

To keep up with the accelerated pace of mobile usage, we’ve grown our team to more than 100 mobile engineers to enable new experiences and improve existing ones.

押宝在 React Native 上

Placing a Bet on React Native

为了提升房客和房东使用 Airbnb 的体验，同时也为了让 Airbnb 的产品更快地迭代和发展，以及为工程师提供更好的开发体验，我们正在持续评估各种新的技术方案。2016 年，我们找到了 React Native。回顾那个时候，我们意识到移动端对我们的业务有多么重要，但我们并没有足够的移动端工程师帮助我们达到我们的目标。因此，我们需要另寻出路。我们的 Web 端主要是用 React 构建的，在 Airbnb，React 是一个高效且广受好评的 Web 开发框架。因为这个原因，我们认为如果用 React Native 进行开发，利用好它的跨平台特性，我们就能够让更多的工程师参与到移动端的开发中来。

We are continually evaluating new technologies to enable us to improve the experience of using Airbnb for guests and hosts, move quickly, and maintain a great developer experience. In 2016, one of those technologies was React Native. Back then, we recognized how important mobile was becoming to our business but simply didn’t have enough mobile engineers to reach our goals. As a result, we began to explore alternative options. Our website is built primarily with React. It has been a highly effective and universally liked web framework within Airbnb. Because of this, we saw React Native as an opportunity to open up mobile development to more engineers as well as ship code more quickly by leveraging its cross-platform nature.

在我们刚开始引入 React Native 的时候，我们知道会有一些风险。我们将要把一个新的、快速发展的而且未经验证的平台代码加入到我们的代码库中，这有可能会让我们的代码库变得更加碎片化，而不是更加统一。我们知道，如果我们决定引入 React Native，我们希望通过一种正确的方式引入。我们使用 React Native 的目标是：

1. 让我们的团队更快地前行；
2. 保证原生 APP 设定的质量标准；
3. 移动端的代码只需要写一次，而不是两次；
4. 改善工程师开发时的体验；When we began investing in React Native, we knew that there were risks. We were adding a new, fast-moving and unproven platform to our codebase that had the potential to fragment it instead of unifying it. We also knew that if we were going to invest in React Native, we wanted to do it right. Our goals with React Native were:

Allow us to move faster as an organization. Maintain the quality bar set by native. Write product code once for mobile instead of twice. Improve upon the developer experience.

我们的经验

Our Experience

在过去超过两年的时间里，我们的尝试带来了庞大的工作量。为了支持一些复杂的功能，比如共享元素转场动画（Shared Element Transition）、视差效果（Parallax）、地理围栏（Geofencing），以及调用网络、A/B Test、国际化等在原生端实现的能力，我们在 APP 里集成了一个庞大的框架。

Over the past two years, that experiment turned into a serious effort. We have built an incredibly strong integration into our apps to enable complex native features such as shared element transitions, parallax, and geofencing as well as bridges to our existing native infrastructure such as networking, experimentation, and internationalization.

通过 React Native，我们上线了一些重要的产品功能。React Native 帮助我们上线了“体验（Experiences）”，这是一个 Airbnb 一个全新的业务，除此之外还有很多比如“评论”、“礼品卡”等功能。大部分这些功能，是在我们没有足够的移动端工程师的情况下开发出来的。

We have launched a number of critical products for Airbnb using React Native. React Native enabled us to launch Experiences, an entirely new business for Airbnb, as well as dozens of other features from reviews to gift cards. Many of these features were built at a time where we simply did not have enough native engineers to achieve our goals.

不同的团队，使用 React Native 时也有很多不一样的体验。React Native 被证实为是一个令人难以置信的好工作，同时，它也给其他人带来了很多技术和组织上的挑战。在这个系列的文章里，我们将会详细介绍我们使用 React Native 的经验以及接下来的工作。

Different teams had a wide range of experiences with React Native. React Native proved to be an incredible tool at times while posing technical and organizational challenges in others. In this series, we provide a detailed account of our experiences with it and what we’re doing next.

在第 2 篇文章，我们列举了作为一项技术，React Native 有哪些方面起了作用，哪些方面没有。

In part two, we enumerate what worked and what didn’t with React Native as a technology.

在第 3 篇文章，我们列举了一些在建立一个跨平台的移动端团队的时候，组织架构上的挑战。

In part three, we enumerate some of the organizational challenges associated with building a cross-platform mobile team.

在第 4 篇文章，我们重点介绍 React Native 在 Airbnb 目前的状态以及未来。

In part four, we highlight where we stand with React Native today and what its future at Airbnb looks like.

在第 5 篇文章，我们利用从 React Native 里学习到的好经验，去把我们的移动端建设得更好。

In part five, we take our top learnings from React Native and use them to make native even better.