- Adapting Mobile for a World with React Native Building a cross-platform Mobile Team: Adapting Mobile for a World with React Native
- By Gabriel Peal
- The Nuggets translation Project
- Permanent link to this article: github.com/xitu/gold-m…
- Translator: ALVINYEH
- Proofreader: DateBro
Build a cross-platform mobile team
Use React Native to adapt to mobile devices
This is aSeries of blog postsIn the third article, this article will outline the experience of using React Native and what’s next for Airbnb mobile.
In addition to React Native’s countless technical advantages and drawbacks, we also learned what React Native means to an engineering organization. Adopting it is more complex than adding new libraries or patterns to an existing platform. It also presents some organizational challenges. Unlike technical challenges, which can often be effectively addressed, organizational challenges are harder to identify, correct, and recover from. Thankfully, though, our mobile culture is healthy, but there are a lot of things to be aware of when considering React Native.
React Native is polarized
In our experience, engineers came up with wildly different opinions when they first introduced React Native, ranging from praising it as a silver bullet for Android, iOS, and the Web, to opposing any use of React Native in teams at all. It was the same after it was officially put into use. Some teams have incredible experiences, while others regret them and return to their roots.
The root cause
There are some inevitable bugs, improvements, and performance issues when using React Native. But there are many touching things:
- React Native itself iterates quickly.
- We can develop both infrastructure and functionality at the same time.
- Engineers can learn React Native together, which is relatively new to everyone.
- The documentation and guidance we use for debugging in development and formal production environments are sometimes inconsistent and can cause confusion.
As a result, it is often difficult to find the root cause of a problem. Sometimes, it’s not clear which team has the problem, or if the issue is inherent to React Native.
React Native is still needed
A common misconception is that React Native allows you to write no Native code at all. However, this is not the case. React Native’s base sometimes continues to evolve. For example, text rendering is slightly different on each platform, the keyboard handles it differently, and the Activity is recreated when rotated on Android by default. A high-quality React Native experience requires careful balance between platforms. Plus, it’s hard for developers to master expertise on all three platforms, making it difficult to achieve a quality experience in development.
Cross-platform debugging
Most engineers can master one or two platforms. Very few people can master Android, iOS, and React. Although most of the work in a mature React Native environment is done with JavaScript and React, sometimes building or debugging something requires delving into the Native stuff. These situations can cause engineers to get bogged down outside their expertise while debugging on platforms they have never used before. Worse, because the root cause is hard to determine, engineers are not even sure what direction to take to fix the problem.
Continue to recruit
Even as we launch React Native, our mobile ambitions and team continue to grow in tandem. However, through word of mouth in the community, many people started associating Airbnb with React Native, and some even thought our app was 100% React Native. That’s far from the case, but many Android and iOS engineers are reluctant to sign up for Airbnb. In case you’re one of them, we’re still hiring!
Hybrid applications are difficult to implement
The 100% Native or 100% React Native roads are relatively easy. But once you mix it up in your code base, a lot of new problems arise. How do you allocate your team? How do teams work together? How do you share state in your application? How do YOU make sure your code is tested? How can engineers debug effectively on all three platforms? How do you decide which platform to use to implement new features? How are resources hired and allocated throughout the organization? These are very important issues that require solutions, and they are inevitably going to come up if you go down this path.
Three development environments
In order to be an effective React Native engineer, it is important to have stable and up-to-date React Native, Android, and iOS environments. For an organization as large as Airbnb, each platform takes a lot of time to configure, learn and stay up to date. After just a few weeks, that often means hours to get everything back up to date.
Balancing Native vs React Native
In many cases, the best solution to a problem requires straddling Native and React Native. For example, our navigation implementation makes heavy use of activities and ViewControllers, much of which is native and suitable for each platform. But a lot of times, it’s not clear whether code should be written in React Native or React Native. Of course, engineers often choose the platform they are more comfortable with, but this can lead to less-than-ideal code.
Cross-platform testing
We find that engineers develop primarily on one platform for convenience or comfort. Often, they assume that if it works on the platform they’re testing, it will work on all platforms as well. For the most part, this proves React Native to its advantage. However, this is often not the case, and it can end up causing frequent problems later in the QA cycle or in production environments.
Break up the team
Teams working in React Native and React Native often face technical and communication challenges. Once the code base is split between React Native and React Native, the code becomes fragmented. Sharing business logic, models, state, and so on becomes more challenging, and engineers no longer have the expertise to work through the process. We knew this was an issue from the beginning, but thought it might be balanced by more collaboration with the Web. Some teams do start sharing resources and code over the Web and mobile devices, but most don’t realize the potential benefits.
Perceived iteration speed
One of our quality goals with React Native was to speed up development. Typically, React Native’s features were written by a single engineer, rather than for each platform. From the React Native engineer’s perspective, if they spend 50% more time than they would on Android or iOS, they’ll feel like they’re taking longer, even if the overall time is less.
Public resources and documents
Android and iOS have been around for a decade, with millions of engineers contributing to learning resources, open source and online help. We use many resources like CodePath to help people learn Android and iOS. Although React Native has one of the largest cross-platform communities and can leverage React resources, it’s still much smaller than Android and iOS. This, coupled with the fact that we had to build most of our infrastructure in-house, meant that our limited React Native resources were heavily invested in education and training compared to our Native resources.
This is the third in a series of blog posts focusing on our experience with React Native and what’s next for Airbnb mobile.
- Part I: React Native in Airbnb
- Part TWO: Technical details
- Part three: Building a cross-platform mobile team
- Part 4: Decisions made on React Native
- Part five: What’s next on mobile
If you find any mistakes in your translation or other areas that need to be improved, you are welcome to the Nuggets Translation Program to revise and PR your translation, and you can also get the corresponding reward points. The permanent link to this article at the beginning of this article is the MarkDown link to this article on GitHub.
The Nuggets Translation Project is a community that translates quality Internet technical articles from English sharing articles on nuggets. The content covers Android, iOS, front-end, back-end, blockchain, products, design, artificial intelligence and other fields. If you want to see more high-quality translation, please continue to pay attention to the Translation plan of Digging Gold, the official Weibo, Zhihu column.