September 4, 2019
Cross-platform development has always been tricky—in exchange for lower costs and shorter development timeframes, developers had to sacrifice either some of the performance or some of the user experience. With the introduction of frameworks such as React Native or NativeScript, however, these limitations no longer held sway. Nowadays, developers can build native-like apps with one codebase and seamless performance, and even use that codebase for the Web equivalent of the same app.
While there are quite a few tools out there allowing developers to build cross-platform apps, they all share one goal—to build high-quality mobile apps with a native feel and functionality, without excessive overhead in the form of two or more codebases to maintain.
In this article, we’ll be comparing two popular cross-platform mobile app development frameworks—React Native and NativeScript—and looking for any advantages that would put one ahead of the other. Hop on.
Before we start taking the two frameworks apart, let’s briefly go over how they work.
First off, there is no magic behind it. You write your app and then either React Native or NativeScript compiles (or rather interprets upon runtime) the codebase into native UI components.
As such, text rendering, for example, is interpreted as [UIView] on iOS and [TextView] on Android.
It’s important to remember, however, that React Native and NativeScript don’t spit out the code in a native app language, i.e., Kotlin for Android, or Objective-C for iOS.
With the basic what’s what out of the way, let’s look at the benefits that React Native and NativeScript’s approach to cross-platform mobile apps development brings to the table.
Code-sharing—both NativeScript and React Native support code-sharing for iOS, Android, and the Web (in case of React Native, with some assistance from ReactXP or React Native for the Web libraries). This is a huge perk, considering that it offers substantial savings on time, costs, and workforce required to build an app.
Good maintainability—with one shared codebase, it’s much easier to maintain app code and deploy any changes.
Single technology stack—spread across the whole infrastructure, one technology stack makes development and maintenance a lot easier and cost-effective.
So this is the extent of their immediate similarity. Here’s where things go in different directions.
Development frameworks popularity. Source: State of JS
The above comparison is just to give you an idea of the popularity of the two frameworks, and how they look like compared to other similar tools out there.
But there are a few advantages that go together with React Native’s immense popularity.
Widespread popularity means rapid growth due to many active contributors and plenty of information available on basically any question or issue you may come against during development.
As of July 2019, there are 145 GitHub contributors and 5,699 commits for NativeScript vs. 1,990 contributors and 17,625 commits for React Native.
Popularity: React Native and NativeScript on GitHub. Source: GitHub
React Native’s huge community is responsible for the framework’s vast repository of third-party libraries and plugins.
Given its massive popularity, it’s also much easier to find developers experienced in React Native than NativeScript, and the available dev pool is much bigger. This is especially important when there’s a need to jump-start a new project and quickly put together an experienced team to handle it.
NativeScript, on the other hand, has an official marketplace with plugins, which is being actively updated and expanded—a major feature that React Native lacks.
With React Native, you have to rely on third-party plugins and libraries created by its vast community of contributors. The downside of this is that even though there are plenty of repositories out there, there’s always some risk of an abrupt discontinuation of those third-party repos. If that happens, developers have to either look for something with similar functionalities or add necessary changes on their own, which can increase development time and costs.
Out of the box, React Native comes with a basic set of API modules that give developers access to native device functionalities. This is where React Native developers have to resort to third-party modules. However, there are so many modules available out there that only very sophisticated functionalities don’t have the necessary API bridges written by the community. But if your application requires an unsupported functionality, you’ll have to write the bridge yourself. And even though React Native has official tools for building API bridges, a more than intermediate knowledge of native languages is called for to use them.
Keep in mind that some features are better off written as modules in a given native language—this helps overcome performance issues in computationally heavy tasks (image/video editing or processing, etc.).
Performance-wise, React Native and NativeScript are comparable. There might be some differences depending on the kind of application, platform, viewing device, and the version of the framework used, but, for example, apps with many animations easily achieve 60 frame-per-second framerates with both NativeScript and React Native.
Code-sharing is also comparable between React Native and NativeScript. Apps written in either of the two can share as much as 90% of the codebase. Generally, the simpler and less custom-styled the app is, the more codebase can be shared.
Both NativeScript and React Native have a considerable collection of native components. Upon implementation, they compile to native-default styles, which might require individual styling to respond to platform-specific needs of the app in development. React Native places more emphasis on styling the components for each platform, to give it an even better native look and feel. NativeScript, on the other hand, is more of a “write once, run everywhere” proponent, although the components can also be styled individually to resemble those of native apps. The code-sharing percentages decrease, however, when a large number of native-platform components come into play.
React Native takes the spotlight in terms of usage—the framework is used by many globally recognizable brands and companies. The portfolio is quite impressive:
React Native’s showcase. Source: Facebook/React Native
NativeScript might be less popular in the mobile app development world, but when you look at the capabilities of this technology and the broad range of apps it’s been used for, you will see that NativeScript’s capacity to meet business needs is similar to that of React Native.
Popular brands that chose to build their apps with NativeScript include PUMA, Sennheiser, and Deloitte Digital.
As you might have guessed, this comparison won’t have a clear winner, as the verdict ultimately depends on the availability of reliable and experienced specialists proficient in either framework.
Is React the pick for your next app?