Pros and Cons of React Native Development in 2021 | Business Perspective
React Native, next to Flutter, is called a revolution in cross-platform app development. Learn the insight of a Full-Stack Developer with 9 years of experience and understand the key pros and cons of React Native. It will help you to consider whether using this solution in your project is a good idea.
This article presents the biggest advantages and disadvantages of React Native. It’s worth to consider them when deciding whether to develop a mobile application with React Native. In what follows, I will present examples of application types for which React Native will work best.
What is React Native?
Facebook engineers created React Native in 2015. It allows you to accelerate the process of creating mobile applications and reduce the costs of their production. It’s a framework that helps to create cross-platform applications for Android and iOS platforms.
Now we can move on to the pros and cons of React Native.
Pros of React Native
What are the benefits of using React Native? The decision to create a mobile application using the React Native cross-platform framework comes with a number of advantages. Below I present the most interesting pros of using React Native (in my opinion).
The main advantage of React Native is the ability to create applications for two platforms using one code. So while working on a given function/update, we create them immediately for each mobile platform. For a product released on both platforms, this can save you time and money by up to 30%.
It’s worth mentioning that thanks to the community support and React Native’s extensibility, the list of supported platforms is growing. You just need to install additional libraries.
Lower cost of app development
Having one team and one programming language also allows eliminating problems when something disturbs the development between platforms. E.g. due to difficulties in implementation on a given platform or random factors such as a programmer’s sick leave in one team).
This, in turn, leads to a situation where the application for one platform is ready, while the other one requires additional work. Typically, it’s impossible for developers to switch between platforms when native languages are used. In the case of React Native app development, there are no such situations – so there’s no downtime, and you can plan the team’s work optimally.
It ensures stable growth of the app
One of React Native’s pros is that RN shares its set of components that “know” how to display the app on a given platform. Thanks to this abstraction, React Native allows the developer to focus on developing the application without going into the details of the platform. So given that, the process of building app features is more stable and resistant to discrepancies between platforms than in separate native teams. This allows for better planning of application releases with new features/upgrades.
It has a rich ecosystem
It’s worth mentioning that we compare the search for libraries strictly for cross-platform programming, excluding those that are universal enough that they can be used for both mobile and web projects. Of course, the number of available libraries doesn’t always translate into their quality. However, it shows the community’s commitment to developing tools for the React Native framework.
Another aspect of increasing access to libraries and tools is basing React Native on how ReactJS works. ReactJS is one of the most popular web development frameworks. Thanks to a common mechanism, many libraries for ReactJs also work for React Native.
It can integrate with the native application
React Native has mechanisms that allow it to integrate with an already existing native application. For this reason, you can find both views that are written natively, as well as views written with React Native in a mobile application. This offers many possibilities.
Developers can write some views with React Native in order to lower their costs (e.g., account management, purchase summary, etc.). And the rest – which the framework can’t handle – remain native.
If you want to transfer your application to a cross-platform solution, your existing application can be rewritten in small steps. This approach reduces the chance of errors and allows for a faster release of the new application.
It’s supported by external tools
The application development process isn’t only writing code but also repetitive routine tasks. For example building (compiling a new version of the application), testing the application using automated tests, releasing the application to the store, as well as investigating and fixing bugs.
Such repetitive tasks are usually delegated to external tools or services (3rd party software), which, once configured, perform them for developers who can instead focus on adding new functionalities. This approach also eliminates human error in repetitive activities.
The most popular tools supporting the process of developing mobile applications that also support React Native are, for example:
- Bitrise – a platform supporting the process of automatic testing, building, and releasing a new version of the application.
- CircleCI – as above.
- Code Magic – as above.
- AppCenter – a platform that comprehensively supports the development process – allows you to test, build, and release a new application. It also helps to share application versions with the test group. Additionally, it supports bug reporting (collecting information about the cause of an error in the application) to provide developers with the necessary information for fixing it.
- Sentry – a platform dedicated to collecting and displaying bug reports that provide the necessary information for its repair.
- Bugsnag – a platform that collects and displays bug reports in order to provide the necessary information for its repair.
- Amplify – a framework allowing for easier integration with AWS services, incl. authentication, data retrieval from API, saving/reading files, and notification service.
Cons of React Native
What challenges do developers and app owners face with React Native? The use of React Native, in addition to its undoubted benefits, also comes with several disadvantages and challenges. You should take them into account when choosing this technology for your application. Let’s dive into the disadvantages of React Native.
It’s not a native solution
It’s worth noting that the performance problem can only arise in applications with high dynamism, in which there are continuous/large changes on the screen, such as, for example, action games. Facebook engineers have made every effort to ensure that applications written in React Native render at 60 frames per second (in accordance with the applicable standard), providing the user with a native experience.
Hard to debug
To facilitate the debugging process, the React Native community and developers have enabled integration with Flipper since version 0.62. It provides many useful tools in the debugging process – bug report, log preview, local database, and performance inspector. Since version 0.63, they have introduced a refreshed error and warning display module.
It doesn’t speed up the testing process
While the working time of development teams decreases, the same cannot be said about the work of the Quality Assurance team. The time spent on testing is similar to testing in native development. And in some cases, it might be even more. This is another factor to consider when choosing React Native for your app development.
Testing is more challenging
One of React Native’s cons is that the use of cross-platform technology introduces two new potential error groups.
At the same time, it’s worth emphasizing that React Native is a mature framework. It is actively used by many Facebook products, as well as many other companies and a large community. Thanks to this we can be sure that React Native is error-free.
The second group of errors that occur only in cross-platform solutions is related to the common source code. If there’s an error there, you can be sure that it will occur on every platform. For this reason, when finding an error, the tester should check whether that error occurs on both platforms.
In the case of native development, such propagation of errors between platforms doesn’t occur. It’s worth noting, however, that in this situation, it’s enough to fix the bug once. Thanks to the shared source code, the bug will be fixed on each supported platform.
Inferior Android support
Initially, React Native only supported the iOS platform. The support for the Android platform was added only in subsequent releases. For this reason, React Native still has weaker support for the Android platform. This was addressed by the Facebook framework development team, and there’s ongoing work that aims to fix this. However, these are not problems that prevent the development of Android applications with React Native. They require more accuracy and testing of this platform.
The second disadvantage of React Native in the context of Android is its performance on this platform. This is one of the reasons why the Discord team decided to develop its Android application with native technology. Nevertheless, in this case, they managed to share 94% of the code – not between mobile applications, but between iOS and web applications (you can read more about the Discord application development use case here).
It’s harder to build a cross-platform team
When to choose React Native?
The framework works well for an application that needs to be developed for both Android and iOS and is based on a custom design. The ability to work on both platforms in parallel shortens the development time. What’s more, the custom design allows for easier and faster styling of views on both platforms. For this reason, this technology is a good candidate for applications where time-to-market is important (Idea review/MVP version). It’s also a great solution if you want to reduce production costs.
The React Native benefits will also come in handy to applications that main goal is to “provide a graphical interface” for communication with API, such as applications for purchases or reporting improvements in the factory. Applications of this type mainly come down to downloading data, displaying it to the user, and sending the user’s changes to the server. In this case, we will get the largest amount of common code, which everyone associates with a faster development process and lower costs.
When developing native applications, it’s worth considering using React Native to create individual views or groups of views, thus lowering the cost of their creation (many companies such as Pinaster or Facebook did that) without losing their quality.
If you have a web application (and in particular one written with ReactJS) that has the same functionalities as the target mobile application, you should consider using React Native. Thanks to the common language and ecosystem, it’s easy to use the code of a web app in an application written with React Native.
React Native is a great choice for those project which do NOT require creating complex animations and strong integration with native technologies such as geolocation or Bluetooth module. Using RN in such cases is not impossible, of course, but would require a lot of additional work.
Alternatives to React Native
React Native is not the only technology out there that allows you to create cross-platform applications.
The oldest of the mentioned frameworks, Xamarin is strongly associated with Microsoft’s technology based on the C# language and the .NET framework. As we can read on its website, Xamarin allows you to share up to 75% of the source code. It supports platforms such as Android, iOS, tvOS, watchOS, macOS, and, of course, Windows.
Xamarin has built-in components that allow creating a design compatible with a given platform. The disadvantage of this technology is a smaller community and a smaller number of available libraries. What’s more, one of its cons is the high cost of the Visual Studio – the IDE license that you need to create applications in this framework. A more detailed analysis of the advantages and disadvantages of this solution can be found on this blog.
Hybrid applications allow you to create a mobile application using any web technologies with any framework and then use the Apache Cordova framework to create a mobile application.
The advantage of this solution is the possibility of using an existing web application and a common code for each platform. The downside is efficiency and the fact that you need to work more on the app to ensure its native feel. For more details, please refer to this article
The last alternative worth mentioning is, of course, the use of native technologies to write the application. This is the most expensive way to execute an application (two teams required) where teams duplicate their code.
The biggest advantage of this approach is application performance. Other benefit is the easiest use of native components such as GPS or Bluetooth, and the native feeling of the application.
The biggest advantage of cross-platform solutions is the simultaneous production of code for both mobile platforms. It saves time and money.
React Native limitations
React Native isn’t a technology without flaws and limitations. The downside of React Native is the poor performance when displaying views in which there is a constant change of elements caused by, for example, a large number of animations.
Due to the fact that it’s mainly developed by the Facebook team to meet their needs, some features aren’t available out of the box or have poor support – e.g., tracking the user’s location while the application is running in the background. For this reason, it’s worth researching first whether the application you want to build will use tools poorly supported by React Native or one of the 3rd party solutions from the community.
The above-mentioned advantages and disadvantages of React Native are worth considering before kicking off with React Native. We’re an experienced React Native app development company that would love to take the whole app development off your shoulders. If you have any questions, leave a comment below, jump on a call, or drop us a line.