The latter used to be slow, have fewer features and offer subpar user experience. But now you can build React Native apps that combine the cross-platform flexibility with native performance and look.
Its ‘learn once, write anywhere’ paradigm allows developers to create React Native apps for web, iOS, Android, Windows, and VR using the same basic framework. Facebook, Airbnb, Instagram, Discord, and many others have already used the tech to create awesome apps.
While React Native has many opponents, there are 4 situations in which React Native (RN) is your best bet.
React Native: pros and cons
Firstly, let’s highlight the main benefits of React Native to see whether it is on a target.
- One team – two platforms
With React Native you don’t have to hire two separate teams to build apps for iOS and Android. React Native devs handle both versions. As the result, the team is smaller, costs are lower and the project easier to manage.
It’s also easier to maintain RN apps as you can keep a single team for both versions.
- Faster development
You can share a significant portion of your codebase between the two platforms. Walmart, for example, reported 95% code reuse for its mobile app. If your app has a lot of features that are radically different for iOS and Android (e.g. payments or TouchID), the number can drop down to about 30%. Still, this is a huge cost saving.
Moreover, you can use some of that code to create a website on React (the predecessor of RN that shares the same development paradigm).
The common codebase is also easier to debug as Android and iOS versions share a lot of bugs.
- 100% native UI
With older cross-platform solutions such as Ionic, you get a web application wrapped in a thin native container. It even runs inside of a borderless “browser” called WebView.
That’s why cross-platform UI/UX often feels off when compared to native apps.
But in React Native, UI is made of native components which provide the platforms’ trademark look. That’s why even native developers can hardly tell RN apps from native solutions.
- Native-like performance
For a long time, complex animations were the framework’s Achilles’ heels. But this problem was mostly solved with the introduction of Animated library.
- Hot reloading
With native apps, debugging is a long and tedious process. But React Native supports hot reloading. It allows developers to immediately see how the changes to the code affect the app while it’s running. This feature saves a ton of time and makes developers happier 🙂
- Updates without app store approvals
Mobile apps often release a new version every two weeks. But each time you push an update, you have to wait for App Store/Play Market to approve it. Although Apple has taken steps to reduce review times, you’ll still have to wait several days.
Number of days to get an App Store approval according to appreviewtimes.com
And React Native drawbacks (I would say ‘specific features’) are:
- Dependence on Facebook
One of RN’s weaknesses come from one of its biggest strengths. If one day Facebook ceases support of React Native, the framework would quickly fall behind both iOS and Android.
However, this is a highly unlikely event. Other large companies, such as Airbnb, would be happy to take up the torch.
- Performance hit
In most cases, React Native performance is on par with native apps.
With each pass along these bridges, your app takes a tiny performance hit. If your app has a lot of complex interactions, this can noticeably degrade its performance.
- Few third-party components
Android and iOS have incredibly large communities behind them. If there’s a frequent problem, you’ll most likely find a ready-made solution in the form of a third-party library or an API.
React Native is a much smaller platform that’s still in its infancy. Obviously, there aren’t that many third-party components that work with it.
And some of them might behave not quite as you’ve expected. A lot of components have tiny communities behind them, the creators can’t always update them frequently.
- Need for native developers
You can solve some of the issues above with the help of native modules.
But implementing them requires Java/Objective-C/Swift expertise. So you’ll still occasionally need some help from native developers. And this might be problematic for startups and small front-end studios.
- Feature lag
Google and Apple constantly introduce new features with updates to their OS. React Native team does its best to bring new functionality to the platform. But that takes time.
So if you want to use some of the fancy features like Face ID in your app, you’ll either have to create native bridges or wait until somebody in RN community comes up with a solution.
Also, React Native only supports Android 4.1+ and iOS 8.0+. So if you have to support older OS versions, you’ll need to find another solution.
Read more: React Native review.
So with these advantages and limitations in mind, what are the areas where React Native can truly shine?
4 types of apps to build with React Native
1. Working prototypes
The majority of apps built with React Native started out as quick prototypes.
If you’re a fast-moving startup, hitting the market with a working product is your top priority.
This is one of the pillars of Agile development: create a solution before your competitors can make their move＞get more people to use it＞iterate quickly based on their feedback. This approach allows you to see if your idea is, in fact, viable while spending the least amount of time and money.
React Native is the perfect technology for such cases.
It allows you to quickly build a prototype that works both on Android and iOS. Moreover, the development can be ~30% faster than with the native tech stack.
Unlike hybrid solutions, your RN app will give test users a truly native experience.
Codecademy prototype made with React Native; source: medium.com
2. Apps with streamlined UI
React Native apps can look and perform just as good as their Android or iOS counterparts.
By themselves, both threads are lightning-fast. But they can only communicate via a bridge. Passing large amounts of data over the bridges will slow down your app. If you have a lot of native UI components communicating with the JS code, the performance will suffer. This is especially true with sophisticated animations and complex gestures.
To avoid performance bottlenecks, you’ll have to minimize passes over the bridge.
You might have to spend a lot of time optimizing your React Native app. This slows down the development leaving you without the framework’s main benefit. You can, of course, move the code to native side but that means more involvement from the Android/iOS guys.
And that takes away another benefit.
In calculation-intensive apps (say, messengers with lots of customization and many processes running in the background), native tech has a massive edge over RN.
But if your app has few interactions and views, RN is perfectly viable.
Bloomberg’s Business News app was built with React Native. After getting tired with developing separate apps for iOS and Android, the company created a quick RN prototype.
Bloomberg liked it so much that they’ve decided to produce a full-scale product. The result is a sleek app featuring stories, videos, live TV, and a personalized news feed. It has great performance and smooth interactive animations.
The team loved the ease of learning, hot reloading and quick iterations made possible by React Native.
Source: App Store
3. Basic cross-platform apps
If your app has many platform-dependent features such as multithreading and audio/video processing, going native may be a better choice.
But React Native is a perfect solution if you have a limited budget, but your targeted market is split evenly between iOS and Android. You can easily make the interface work on both platforms.
The app layout is based on flexbox which works similarly across Web, Android, and iOS. Coming from native development, this’ll save you a lot of headache.
Townske has created a React Native app for sharing city guides. As the company had only one developer, building separate apps for iOS and Android was out of the question.
React Native allowed Townske to quickly develop a cross-platform mobile app with existing talent. As the company already had a React-based web application, they’ve reused most of its business logic in a mobile app.
Despite running into some difficulties early on, Townske quickly overcame them using community-created fixes. The company is very optimistic about the framework’s future citing the development speed, code reuse, easy debugging, and a strong community as its main benefits.
Source: App Store
4. Apps without heavy use of native APIs
React Native apps have to rely on native APIs for things like camera, GPS, etc. To implement them you’ll have to write bridges, which is time-consuming, requires native expertise and can affect the app’s performance. If your app doesn’t use a lot of native APIs (e.g ecommerce app), React Native is a reasonable choice.
You can build React Native apps that are just as good as their native counterparts.
Of course, if you need complex animations, video/audio processing or rely heavily on native APIs, nothing beats native apps. But for the most part, React Native apps have native UI and great performance.
React Native is a perfect choice if you want to quickly turn your idea into a cross-platform app and carve out a niche in both Android and iOS markets. Feel free to contact MindK team and start working on your next React Native app.