NativeScript and React Native allow building multi-platform mobile apps. Which one to choose? If your team already built a web app, the choice depends on your tech stack. If you start from scratch, one of them stands out.
A QUICK SUMMARY – FOR THE BUSY ONES
TABLE OF CONTENTS
It’s no secret that having a strong mobile presence is no longer optional.
Worldwide, mobile devices have outgrown desktop use, and the trend toward mobile computing is transforming how organizations communicate with their customers, present their ideas, and reach their business goals.
But simply deciding to establish a mobile presence is just the first step because there is more than one way to reach mobile users.
In this article, we are taking a closer look at JavaScript mobile development.
Specifically, we are comparing NativeScript with React Native to see which of these two mobile app development frameworks for writing natively rendered mobile applications for iOS and Android has more to offer.
For a long time, native mobile apps ruled digital distribution platforms and marketplaces.
Developed in a platform-specific programming language, such as:
Platform-specific tools provide seamless access to native platform APIs, and their optimized performance ensures the best user experience possible.
However, native mobile apps are not without their fair share of disadvantages.
Their biggest downside is that it’s not possible to deploy the same code on different platforms.
Let’s say an organization decides to develop an iOS app and hires or outsources software developers, UI specialists, and other professionals. To make the same app available to Android users, the organization would have to hire a new team to port the app to Android.
Not only is it expensive to target multiple platforms with native development, but it can also be very time-consuming.
<span class="colorbox1" fs-test-element="box1"><p>Tip: By the time the app is finally in both the Google Play Store and the Apple App Store, there might already be many competing apps with great reviews, making it difficult for the newly released app to gain traction. </p></span>
Of course, making the app available is just the start of a new phase, characterized by ongoing maintenance and feature upgrades, and it goes without saying that it’s far more cost-effective to maintain a single codebase than two.
For these and other reasons, mobile web apps have skyrocketed in popularity in recent years.
They are essentially responsive web apps developed using the three core web technologies—HTML, CSS, and JavaScript—and wrapped in a native application shell without requiring any changes to the underlying application.
Unified development is by far the most important advantage of mobile web apps, but it’s not the only one.
Mobile web apps also tend to be much easier to update than native mobile apps because they share a single code base, so it’s enough to make changes once. Because HTML, CSS, and JavaScript are all industry-standard front-end technologies, it’s easy to find skilled developers capable of turning any idea into a great user experience.
But, again, mobile web apps are not without drawbacks.
While their inherent performance limitations are fairly easy to overlook these days, the fact that they don’t provide access to native components greatly limits what can be achieved with them.
To make sure a JavaScript mobile app will succeed, business owners need to carefully choose vendors from top mobile app development companies.
<span class="colorbox1" fs-test-element="box1"><p>Tip: Users have come to expect native features, such as voice input, push notifications, and GPS, and they will actively avoid mobile apps that don’t support them.</p></span>
That’s where technologies such as NativeScript and React Native come in.
These two JavaScript mobile development frameworks for writing natively rendered mobile applications for iOS and Android make it possible to access native features using JavaScript, combining the benefits of native mobile apps with the benefits of web apps.
NativeScript was first released in 2014 by Progress Software Corporation. On its website, NativeScript describes itself as an:
<blockquote><p>“open-source framework for building truly native mobile apps with Angular, Vue.js, TypeScript, or JavaScript.”</p></blockquote>
With NativeScript, it’s possible to develop native mobile applications for Android and iOS from a single codebase and enjoy the native-like performance with 100% direct access to all iOS and Android APIs.
Building beautiful, accessible, and platform-native user interfaces without WebViews is easy and can be achieved with JavaScript, CSS, and Native UI markup.
Some of the most popular apps created using NativeScript include:
Stephen Fluin, Developer Advocate for Angular at Google, says:
<blockquote><p>“We love working with the NativeScript team because of the way that they empower web developers to leverage their skillsets to build native experiences on mobile,”</p></blockquote>
Even Payne, Senior Front-End Software Engineer at Netcentric, echoes the same sentiment:
<blockquote><p>“By using a technology like NativeScript, we gave our Netcentric frontend teams the power to build amazing native mobile apps. This enables us to do more on mobile than we could ever do before,”</p></blockquote>
First released in 2015, React Native is one year younger than NativeScript. This JavaScript mobile development framework was created by Facebook after the company realized that its mobile applications relied too much on HTML.
Mark Zuckerberg famously said in an interview at TechCrunch Disrupt:
<blockquote><p>“The biggest mistake we made as a company was betting too much on HTML5 as opposed to native,”</p></blockquote>
Just like NativeScript, React Native can be used to create native mobile apps for Android and iOS.
It combines the best parts of native development with React, which is a best-in-class JavaScript library for building user interfaces.
React Native apps render native components and use the same native platform APIs as true native apps do.
Thousands of apps use React Native, including some of the most downloaded and popular apps in the Google Play Store and the Apple App Store, such as:
Fanghao (Robin) Chen, Mobile Lead at Discord, once said:
<blockquote><p>“Looking back at the past three years, React Native has proven to be extremely successful at Discord and helped drive our iOS user adoption from zero to millions!”</p><p>“More specifically, React Native has allowed us to reap the benefits of quickly leveraging reusable code across platforms, as well as develop a small and mighty team.”</p></blockquote>
Now that we’ve introduced both NativeScript and React Native, it’s time to take a closer look at some of the key differences and similarities between them.
Since both NativeScript and React Native are JavaScript mobile development frameworks, any developer that has at least some experience with JavaScript should be able to get started with them in no time.
<span class="colorbox1" fs-test-element="box1"><p>Tip: Developers who are already familiar with Angular will find it easier to use NativeScript because of its deep integration with the Angular CLI, router support, code generation, and more.Likewise, developers who are already familiar with React will be able to easily transition to React Native.</p></span>
Both NativeScript and React Native allow developers to write using:
However, if you create a new project in React Native you’ll notice that it uses Flow as a default, while NativeScript uses TypeScript. Of course, you can change that if you wish.
NativeScript relies on either Angular or Vue.js for building engaging user interfaces, whose lightweight nature makes it great for mobile development.
Vue.js for the web and NativeScript-Vue are very similar and getting started using NativeScript-Vue is a matter of switching the plugin you include at the start, changing your app instantiation parameters, and writing your front-end templates to use NativeScript modules.
React Native developers specify the layout using Flexbox, which works the same way in React Native as it does in CSS on the web, with a few minor exceptions. The biggest difference is that styles are declared using JavaScript objects and properties, which translate back to their CSS origin.
<span class="colorbox1" fs-test-element="box1"><p>Tip: Both NativeScript and React Native can be debugged using Chrome Developer Tools, also known as Chrome DevTools.</p></span>
React Native users can also take advantage of React Native Debugger and Reactotron, while NativeScript users sometimes use the Visual Studio Code NativeScript extension.
It’s also possible to use XCode for debugging generated views of apps developed in both of the mentioned technologies.
We’ve already explained that both NativeScript and React Native can readily access native Android and iOS APIs using JavaScript.
When it comes to NativeScript, you can directly access all iOS and Android APIs without wasting time writing boilerplate wrappers.
<span class="colorbox1" fs-test-element="box1"><p>Tip: If you don’t want to write directly against iOS and Android APIs, you can choose from a wide selection of pre-built, open-source, NativeScript plugins, which are available on the NativeScript Marketplace.</p></span>
React Native doesn’t have a specialized marketplace for plugins, but it’s easy to extend the built-in components it comes with by searching the npm registry for packages mentioning react-native.
Using native modules, developers can write real native code and have access to the full power of the target platform, but it’s rarely necessary to do so since React Native is very capable right out of the box.
NativeScript uses a single-threaded model because it provides fast access to the native APIs, while React Native uses a multi-threaded architecture, with JavaScript and the user interface running on separate threads.
The biggest advantage of the React Native’s multi-threaded architecture is that JavaScript processing does not interfere with UI rendering.
On the other hand, the UI of a NativeScript app can get stuck when processor-intensive JavaScript code is executed.
However, NativeScript has one trick up its sleeve: it uses Google’s V8 on Android. React Native, on the other hand, uses Apple’s JavaScriptCore on iOS and Hermes on Android. Thanks to Google’s V8, NativeScript apps tend to have significantly better startup performance than React Native apps.
Overall, the performance of these two JavaScript mobile development frameworks is more or less comparable, apart from edge cases.
At the time of writing this article, React Native is far more popular than NativeScript.
According to this week’s npm stats:
When it comes to GitHub stars:
The company behind NativeScript, Progress, has been doing a good job when it comes to making NativeScript better as a technology, but they don’t spend much money on marketing.
React Native stands on the shoulders of Facebook, so even very large enterprises feel confident adopting it as their JavaScript mobile development framework of choice.
For those who have already built a web app with Angular, Vue.js or React, the choice between NativeScript and React Native is obvious:
Those who are building a cross-platform mobile app from scratch can choose either way without making a mistake, but there are several compelling reasons to lean toward React Native.
Our promise
Every year, Brainhub helps 750,000+ founders, leaders and software engineers make smart tech decisions. We earn that trust by openly sharing our insights based on practical software engineering experience.
Authors
Read next
Popular this month