20 July 2021 by Patrycja Paterska
React Native's popularity is still growing. Learn the pros and cons, and when to use React Native for your mobile app development.
Both frameworks: ReactJS (web) and React Native were brought to life by Facebook. React Native was a Hackathon project aiming at solving the company’s biggest pain point - maintaining two code bases for their app. The problem with maintaining two code bases for such a big app? Work duplication and, at times, solving the same problem in two different ways. React Native is a straightforward answer to these problems.
As we mentioned, just like React Native some years later, React was also brought to life by Facebook in 2011 as a direct answer to their scalability problems. It was a time when Facebook ads were growing immensely, and the constant updates to their UI slowed down the platform significantly. React solved this problem, and in 2012, when Instagram was acquired by Facebook, it was also used on the app’s timeline.
The bottom line? Both frameworks are closely related to each other, but they serve an entirely different purpose. React is used for web development, and React Native (which does not use HTML) is used for mobile development.
This type of architecture offers the benefit of using a lot of OS-native features, but also comes with important challenges; e.g. constant use of bridges inside the app may significantly slow down its performance. If you’re building an app that involves many events, a lot of data, etc. React Native might not be the best option. More on that below.
The effective development for multiple platforms at once is the biggest and strongest advantage of React Native. Utilizing the same code base for different platforms carries other benefits: faster development and time-to-market of your app, easier and cheaper maintenance (you take care of one not multiple code bases), and a smoother onboarding process for new developers joining the project.
Thanks to the "hot reloading" feature, React Native enables developers to see the changes in the code in a live preview, without the need to refresh anything. This seemingly small tweak can actually tangibly improve the development process as it provides real-time feedback to anything that has been altered inside the code.
Compared to other cross-platform development solutions, React Native’s “bridge” concept can be seen as revolutionary. Since React Native apps allow usage of natively written code it is not as laggy as web-based cross-platform solutions. The official claim is that React Native gives “native-like” performance, but it is not necessarily true, the best way to put it is that it gives “near-native” experience.
Cost efficiency is the heart and the very reason for cross-platform development. Thanks to reusing code on multiple platforms, you usually need a smaller team to deliver the project. As opposed to native development where you need two separate teams to deliver basically two similar operating products instead of one.
React Native is an open source framework, and as of now its community is thriving and constantly expanding. We can’t forget the involvement of Facebook, as they are constantly working on improvements and elements widening the framework. What this means for you is that even if you encounter a problem that has not yet been solved in React Native you might find a bunch of people eager to help you out as they are concerned with making the framework more comprehensive and stable.
React Native is still relatively new, and as we mentioned earlier, definitely has some limitations, glitches, and issues needing to be addressed. Some custom modules do not exist in the framework, which means developers might need more time to build and create their own new ones from scratch. Your partner company or your developers should let you know about this during the app estimation process.
The strongest asset of React Native - implementing native code for better performance means that at times React Native developers might find themselves in need of help from native mobile app developers. Same goes for publishing the app in the AppStore and Google Play Store. Typically, native mobile developers are more familiar with the procedure and necessary documentation for a successful launch.
This might not be an issue if you’re cooperating with an agency, where there are already native mobile developers that could give the React Native team a hand. But it is definitely something to consider when you’re working solely with your own cross-platform team.
Relying on a third-party open-source technology has its cons on its own. If Facebook decides to step down from using the technology it might cause others to move back from it. As of now, nothing suggests this turn of events: Facebook utilizes React Native in their main Facebook app, the Ads Manager app, Facebook Analytics, and Instagram. The framework’s community is constantly expanding and new big companies are jumping into the game.
Nonetheless, this is something to be mindful of. Native technologies offer much more support and backward compatibility in this respect, compared to any cross-platform solution.
We’ve discussed the React Native performance as superior to other cross-platform solutions available, but it is still somehow slower compared to the native app development. The React Native’s impact on your app’s performance is best discussed with your development team. For the majority of the apps available, it is a small, almost unnoticeable bump, which can, however, grow if the app is dealing with a lot of data or “bridges”.
There are no real industry-related constraints on when you can or cannot use React Native. The main point is that it is a good-enough framework for all customer-facing applications that do not rely heavily on OS-specific features and integrations, e.g. AR, VR or do not need complex design or animations to establish competitive advantage. React Native makes them faster to develop and as of now offer enough support and modules to build a stable application. Another advantage is that when your web app is built in React, it is also easier to build a React Native mobile app.
Numerous big players are actively using React Native in their products, or have just decided to switch.
The list of companies using React Native would be incomplete without Facebook, its ultimate creator. Their goal was to bring all the joys of web development (quick iterations, one team to develop the product) to mobile. On their blog, the Facebook team explained how they first converted only one element to React Native (the Events tab in their Facebook for iOS app), and they managed to make the startup time twice as fast. Thanks to the fact that the improvements were done at the framework level, the app would automatically benefit when migrating to the latest version of React Native.
Apart from Facebook's iOS and Android apps, which were adjusted to React Native, Facebook built their Ads Manager from scratch using React Native.
Facebook apps for iOS and Android are not the only ones relying on React Native. Instagram started exploring React Native in 2016, and in their blog post, they also expressed it allowed their product teams to ship features faster on both platforms, iOS and Android. They also shared the percentage of code shared between the apps which was directed at improving developer velocity.
(Source: React Native at Instagram, Feb 6, 2017).
Walmart is an American multinational retail company operating a chain of supermarkets. Their app offers online shopping, product search, in-store price checking. Currently, 95% of the code utilized in their app is written in React Native.
Image credit: Walmart
Some of the biggest React Native benefits mentioned by Walmart are: leveraging the same automation test suite on iOS and Android, the control over the update release dates, and for both platforms at the same time.
Bloomberg jumped onto the React Native ship quite early - in 2016, when they shipped the first version of their new app. The Bloomberg app gives users access to content personalized to their location, alongside curated news reflecting a given time of day. This quickly became a company transition with plans to implement React Native also in other Bloomberg apps.
Image credit: Bloomberg
Tesla does not disclose much information about why they chose React Native. The app serves as an assistant and companion for all Tesla vehicles. The app syncs both Android and iOS devices with the car and allows to control and monitor almost all of the Tesla features; the charger, locks, lights, the panoramic roof or the horn.
Shopify recently announced that React Native is the future of mobile at the company, stating they will help enhance and better the app experience across iOS and Android platforms. They also partnered up with Facebook, and are sponsoring notable people from the React Native community - all to boost the efforts and help build a comprehensive cross-platform mobile experience.
As we mentioned, there are no real industry-specific obstacles in terms of using React Native, it all comes down to establishing your app’s key features and competitive advantage.
React Native is a perfectly good solution for all consumer-facing apps as it offers just on-point performance, and it is (in most cases) easier and cheaper to build than two separate native apps with the same service or product. Most of the consumer-facing apps do not rely on complex animations and UIs which, again, makes React Native a great and reliable solution for the endeavour.
See some of the companies in various industries that utilize React Native in their businesses.
You can see more apps and case studies here.
React Native has numerous advantages for most businesses out there. Besides the speed and the cost of the app’s delivery and maintenance, it requires fewer UI sacrifices compared to other cross-platform solutions. The performance is near native, and the number of case studies from companies (big and small) confirms that it seems to check all the boxes for both users and businesses themselves.
The key React Native challenges to consider are: your app’s scalability plans (dealing with a lot of data may significantly hinder the React Native app’s performance), the user interface design complexity, and the amount of modules that have not yet been developed in React Native (they can take up a lot more time from your development team). To see if your app’s backlog has any, you can consult your software development partner.
That being said, remember that your app’s success very much depends on the developers’ skills and expertise. When building your cross-platform app, choose a partner who will be able to estimate all the risks and potential opportunities for your app in the given technology. With React Native, it is good if your partner has some experience in building native apps as well.
Maybe it’s the beginning of a beautiful friendship?
you can explore blog post that we recommended for you 👇🏻