React Native vs Native: A Guide for App Developers in 2023

ProfilePicture of Fabio Ferreira
Fabio Ferreira
Senior Full-stack React Developer
A 3D mobile phone with an application, and the logos of React, Kotlin and Swift next to it

Mobile applications have traditionally been written in native languages. Lately, however, hybrid cross-platform frameworks have been gaining market share. The recent swell of React Native’s popularity has raised the question: should developers use React Native for mobile development instead of native app development? 

In the last 4 years, the React Native framework has grown to a community of over 2,000 contributors that averages 1,200,000+ weekly downloads through npm. Some of the largest companies in the world have embraced React Native, including Facebook, Pinterest, Skype, Uber, and Brex. Its widespread adoption is primarily driven by the convenience of its cross-platform nature and the unique technological approach used to accomplish this.

Despite React Native’s success, many people maintain that traditional native mobile apps are still the way to go. The proponents of native primarily cite its performance advantages and robustness when compared to hybrid alternatives. Tradeoffs exist between both options, and careful consideration is required when choosing between the two technologies. This article will weigh in on the matter by delving into what makes React Native so popular, and explore how it works under the hood. We’ll also look at the pros, cons, and business impacts of each option, giving you the facts worth knowing before making a choice one way or another.

Table Of Contents

Comparing React Native vs Traditional Native Apps

React Native is written primarily with JavaScript and classified as a “hybrid” framework, meaning that it’s platform-independent. This separates it from traditional apps written in native languages such as Java or Kotlin for Android, and Swift or Objective-C for Apple. Instead, hybrid apps have a single codebase that produces an app that will run on both Android and iOS devices. The benefit to this is obvious: less code and related logistics when compared to writing a pair of native apps using different languages. The drawbacks of hybrids are that they aren’t as performant as their native equivalents, and they sometimes lack the ability to make full use of a device’s resources.

Most hybrid frameworks that you may be familiar with, such as Ionic, Cordova, and Phonegap, rely on what’s known as a WebView to accomplish their cross-platform capabilities. Essentially, they embed a webpage inside a native app and hook into it to integrate with the underlying device. The problem with this is that WebViews, especially when hosting complicated apps, run into performance issues and other limitations.  

diagrams comparing a native app with WebView vs a web app.

React Native does things a little differently. It doesn’t use WebViews, but rather a system that allows it to render native components (hence the name) from its base JavaScript code. There’s a common misconception that React Native compiles JavaScript down to native languages such as Swift or Java, but that isn’t the case. To get a better understanding, let’s compare the underlying structure of a “Hello World” app featuring a labelled button written in React Native to its equivalent native iOS version:

Screenshot of a React Native app structure example vs a native iOS example

Now it’s obvious that the native iOS version looks “cleaner”, but that isn’t really a concern here. What’s important is that we see there are no WebViews in use, instead we have a set of native components. The stack of views in the React Native example is simply forming the basic responsive layout of the app, given that React Native uses Flexbox. The performance impact of this is essentially nominal, and well worth it, given that the need for WebViews has been removed.

However, there are still some performance concerns worth noting when analyzing how React Native achieves this feat.

How Does React Native for App Development Work?

In a React Native app, its JavaScript logic runs in a dedicated thread, while the rest of the app runs in what we’ll call “the native realm”. JavaScript handles the business logic of the application, while the native realm renders the UI and manages device interactions. These two domains rely on something called “the Bridge” to communicate.

Diagram integrating native modules into React Native.

The JavaScript thread and the native realm can’t have a direct conversation – they are unable to listen, respond to, or cancel events and operations happening on the opposite side. Instead, they pass serialized messages back and forth via asynchronous message queues. This system “bridges” the gap.

For example, React Native may send a message to the native realm saying “render this button”, to which upon receipt (ie. the next time it checks the message queue), native does. Later on, when the user clicks on this button, native dispatches a message to the JavaScript thread informing it of the action, triggering some associated application logic, which will then result in a UI update being pushed back into the queue for native… and so on.

Due to the disconnected and asynchronous nature of this means of communication, some performance issues can arise. Queues can get bogged down, say for example if the user is rapidly scrolling through a long and complicated list – many “user has scrolled” and “draw this new UI” updates fly back and forth. For a similar reason, animations can also be a point of concern. In reality, most of the time these kinds of performance deficits are negligible to the user; however, they are still something developers need to be aware of so they can be designed around. 

The good news is that initiatives such as the JSI (JavaScript Interface) are in development to replace the Bridge with something better. Developers can also use native modules to supplement their app with truly native code to leverage device-specific functionality or address performance issues. This means that having developers familiar with native on your team can be very beneficial.

React Native continues to evolve, given its popularity and supporting community. It remains a top choice for developers and warrants consideration for those thinking of building an app.

Pros and Cons of Native Frameworks vs React Native

Both approaches to mobile development have notable tradeoffs. It’s important to consider the strengths and weaknesses of each option with respect to an application’s use case and your organization’s structure:

A table comparing the pros and cons of native development.

Pros of Native App Frameworks

Cons of Native App Frameworks

The downsides of native frameworks can be summed up in one word: logistics. Assuming you are targeting both Android and iOS, you have to do most things twice. Two development teams, two codebases, separate testing and deployment pipelines, and so forth. Not only is there a doubling of most work, but the two streams must be kept in sync, requiring additional oversight and planning. New features and changes have to be coordinated and timed together, and problems quickly arise if one side falls behind or diverges from the other. A solid set of processes are required to keep things running smoothly. 

The bottom line is that more time, effort, and money must be expended when compared to hybrid alternatives such as React Native.

A table comparing the pros and cons of React Native development.

Pros of React Native Development

Cons of React Native Development

With those caveats under consideration, it’s worth reviewing the different situations where it makes sense to choose one approach over the other.

Examples of When to Choose Native vs React Native

A table comparing when to use native vs when to use React Native depending on project type.

When to Use Native App Development

When to Use React Native

To Conclude: React Native or Native for Mobile App Development?

A mobile app is not just a bunch of lines of code, it’s a business. As such, the decision to choose one path over another is not purely a technical one. The bigger picture and associated implications must be considered when deciding whether React Native or traditional native is to be used as your foundation going forward.

On paper, it seems to make sense to develop natively instead of via an abstracted framework that sits on top of the native realm. Native provides superior performance and gives developers complete access to the capabilities of each device. It’s true that some use cases require this level of control. However, these benefits come at a cost – in the literal sense. The duplication of work and associated logistical effort can be taxing on a business that is not able to support it. With that in mind, it may be the case that an alternative approach is more well-suited to your situation.

With React Native development, in most cases, you get the best of both worlds: lower effort and associated cost and time to market, while still producing a robust and performant app that stands up against its native competition. The React Native framework is often the clear choice for rapid prototyping and the production of MVPs – a process that can serve as an evaluation of whether or not the technology meets the long-term requirements of your project. These benefits make React Native a strong option for a lot of organizations. Still, if you need pure horsepower or have a use case that requires it, native can sometimes remain the way to go.

Ultimately, there is no silver bullet. Careful consideration is required when making such a fundamental decision. Review the benefits and limitations of the choices before you.

Originally published on Apr 20, 2021Last updated on Aug 16, 2023

Key Takeaways

Is React Native better than native?

React Native and native development each have their own advantages and disadvantages. React Native enables developers to build mobile apps with JavaScript, making development faster and allowing for code reuse across platforms. With native development, however, you have to create separate apps for each platform using different programming languages, but you get better performance and access to specific platform features. Ultimately, which is better will depend on the requirements of your project and your preferences.

Is React Native truly native?

No, it’s written primarily with JavaScript and classified as a “hybrid” framework, meaning that it’s platform-independent. React Native isn’t the best choice for applications with high-performance requirements – specifically those with graphically intensive or data-heavy workloads as they are better served by native applications.

Is native faster than React Native?

Yes. Although React Native has sufficient performance for most use cases, native frameworks are better suited for resource-intensive apps such as those using 3D/AR/VR technology, as well as data or animation-heavy applications.

Why choose native over React Native?

If your project requires advanced features and performance, native development could be the better option. Platform-specific features, complex animations, high-performance apps, and more control are just some of the advantages of native development.

Looking to hire?

Join our newsletter

Join thousands of subscribers already getting our original articles about software design and development. You will not receive any spam, just great content once a month.

 

Read Next

Browse Our Blog