NativeScript vs React Native: Choose Your Approach For Mobile App Development
Mar 30, 202111 min read
Co-founder at Ideamotive. Technological advisor and software consultant.
Cross-platform development has always been a challenge - in exchange for lower costs and shorter development times, developers had to sacrifice either performance or user-friendliness. However, with the advent of frameworks like React Native or NativeScript, these restrictions no longer apply. Currently, developers can build native apps with a single codebase and flawless performance. They can even apply that codebase for the same app's web equivalent.
There are quite a few tools out there to enable developers to build cross-platform apps. And they all have the same goal: creating high-quality mobile apps with a natural feel and functionality without the excessive overhead of two or more codebases to maintain.
In this article, we will compare two popular cross-platform mobile development frameworks - NativeScript vs React Native - and try to identify the advantages that one would allow over the other.
What is NativeScript?
NativeScript is a framework created by Telerik (Progress Software). While it's not as hype as React Native, some internationally renowned companies (like Raiffeisen Bank) are in favor of NativeScript. SAP, the world's largest ERP company, is also the one that uses NativeScript. The company has decided to use this framework to build its Mobile Development Kit.
Objective-C on iOS;
Java on Android.
What is React Native?
React Native is based on the React web framework from Facebook. Since its first release in 2015, its reputation and community have grown steadily. Naturally, most Facebook-owned companies use React Native as their preferred mobile platform. However, its fame goes further and reaches Tesla, Uber, and Walmart.
So the guys at FB thought it would be excellent if they could use React to build cross-platform mobile apps, and in 2015 React Native was presented to the public and appeared on GitHub, where everyone could contribute.
Experience shows that mobile app developers tend to devote their skills and efforts to building mobile apps using these two frameworks primarily. A sort of React Native vs NativeScript battle has even begun.
Now the time has come to compare NativeScript vs React Native.
So, React Native developers or NativeScript ones? Which technology is better? How do they differ? What do they have in common, and when does it make sense to use one over the other?
To answer these questions, let's expand our knowledge of these tools and compare their most significant differences.
NativeScript vs React Native: Speed of Coding & Easiness of Coding
React Native is a game-changer in development speed in some way. Unlike NativeScript, this framework contains reusable components. What does this mean? Once you have created a user interface component, you can use it in various application screens.
In terms of development workflow, these frameworks use the same approach and steps:
Create a new project
Use components or widget to create the user interface
Apply layout and customize style
Test your app on emulator/simulator
Add the required functionality
Run tests and debug the application
Well, you understand what the workflow looks like. Chrome DevTools allows you to debug your NativeScript or React Native application. One of the drawbacks is that the tool does not have an element inspector. The in-app view inspector is only useful for simple apps. To fix this weakness, NativeScript developers debug with an extension: Visual Studio Code, and React Native developers use React Native Debugger or Reactotron.
Winner: React Native
NativeScript vs React Native: Performance
NativeScript offers slow rendering, and in a world where every second count, this is hard to accept. And this is where React Native comes in.
React Native performance is a multi-threaded approach: JS and UI run on different threads. This speeds up access to native APIs. React Native apps use the virtual DOM to update and synchronize UI components. Thus, React-based apps are faster than NativeScript-based apps.
Winner: React Native
NativeScript vs React Native: Code-Sharing
Code-sharing is also comparable with React Native and NativeScript. Applications written in either of the two can share up to 90% of the codebase. Typically, the simpler and less customized an application, the more codebase you can share.
Both NativeScript and React Native have a sizable collection of native components.
Once implemented, they are compiled to default styles, which may require individual styling to suit the needs of the platform-specific application being developed.
React Native emphasizes styling components for each platform to give it an even better natural look.
On the other hand, NativeScript is more of a write-once, run-anywhere approach, although we can also style its components individually to resemble native application components.
However, the percentage of code sharing decreases when many native platform components come into play.
NativeScript vs React Native: Documentation
Both frameworks are quite old which gives them an extensive base of documentation. Each of the technologies offers its developers to find answers and read more information regarding particular workflow aspects.
As for NativeScript, the community continues to create documentation and resources.
Talking about RN, given its famous roots, the documentation could be more explicit and clearer than it is now. But still, experienced developers can find everything they need here.
NativeScript vs React Native: Popularity
We cannot deny that if it comes to a popularity competition between the two, React Native will come out on top. It is the most popular cross-platform application development environment of all existing ones, including Xamarin, Ionic, Flutter, and of course, NativeScript.
Widespread popularity means rapid growth, thanks to the many active contributors and the wealth of information available on almost any question or issue you may encounter during development.
Also, a good marker to see the real popularity in numbers is the data from Google Trends.
Here we can see that NativeScript couldn’t even manage to come closer to the RN’s search queries.
However, it's important to remember that popularity isn't everything in this business. There are other factors to consider. However, let's not forget that Facebook developed React Native, so it was much easier to bring this technology to market and make it available.
Winner: React Native
NativeScript vs React Native: Community
Both tools have strong specialist communities, but the difference is clear. React Native is created by Facebook, one of the leading IT companies today. The creators and the entire community are adding different plugins to React Native functionality every day.
Thus, the community is growing faster.
NativeScript is also open source, but development is slow. There are fewer plugins, and some of them have not even passed due diligence.
Obviously, the React Native community is bigger and definitely more mature.
Winner: React Native
NativeScript vs React Native: Talent Pool
Given RN’s immense popularity, it is much easier to find developers with experience with React Native than with NativeScript, and the pool of developers available is much larger.
This is especially important when you need to jump-start a new project and quickly assemble an experienced team to solve it.
A decent source here is Stack Overflow Research. It shows us that RN is loved by 59.7% of respondents, while NativeScript didn’t even manage to be featured in this rating.
To put this in numbers, we decided to showcase GitHub statistics:
NativeScript + Angular,
NativeScript + Typescript,
NativeScript + vanilla JS,
NativeScript + VueJS.
If, however, you or your team weren't that familiar with cross-platform before, the learning curve can be pretty steep. It makes sense to bring in experienced consultants and mobile developers to help transfer knowledge and best practices to your team.
NativeScript vs React Native: Testing
React Native leaves the developer with complete freedom to choose the most convenient test automation environment, like with the IDE. You can use any testing tool that suits you:
KIF, and many more.
NativeScript provides the ability to use its own QA workflow, released as open-source in 2017. When it comes to tests per se, you can run unit tests directly from the NativeScript CLI using Jasmine, Mocha, or Quint.
On the other hand, functional testing is available through many external providers, one of which is Appium.
However, both solutions can save you significant expenses. Since we are talking about cross-platform one, such a feature like code sharing is a huge perk. It is huge considering that it offers significant savings in the time, cost, and labor required to build an application.
Moreover, a single technology stack, distributed across the entire infrastructure, greatly simplifies and reduces development and maintenance costs.
Want to refresh everything you read? Here is a quick summary table regarding every point we talked about.
Main Pros and Cons
It's open-source and free. This fact means that you can contribute to the code and use it as you see fit. But be sure you do not violate the Apache 2.0 license.
This allows you to create truly native apps for Android and iOS devices. Each of the user interface components provided by NativeScript is translated into their corresponding native user interface components.
This gives users a more natural experience than hybrid mobile apps like Cordova.
The ability for developers to easily build, deploy, and manage their NativeScript applications through the Telerik platform.
It has zero-day support for new platforms. This means you can immediately use the latest native APIs and UI components whenever Google or Apple updates their platform.
You can do practically anything with the NativeScript CLI. Also, the basics such as creating a new project, adding a platform, running on a device, and deploying to a specific platform are included.
Alternatively, you can also install plugins, debug the app, and upload it to the app store.
NativeScript has no HTML and DOM. You will need to learn how to use the various UI components to create the UI for your application.
No plugins tested. While there are many NativeScript plugins on npm, you can never be sure of their quality.
Devs need to know the native Android and iOS APIs to access device hardware and other platform-specific functionality.
Due to its nature, you can only test apps on a real device or emulator. This slows down the initial test setup. But once you run it on your device, a hot reboot takes over. This means that every time you make changes to the source code, it immediately reloads the application to reflect the changes.
Not all user interface components are available for free. You need to purchase Telerik UI for NativeScript if you want to use components such as charts and calendars.
React Native Pros
The advantage of React Native is that development is based on the well-known React library, but at the same time, the applications are displayed as if they were developed natively for each platform.
The lead time for a prototype application is much shorter. React Native development happens in a modular way. The application is actually assembled from "bricks."
The individual modules adapt and integrate with each other. Experienced employees can prepare such applications in no time. Less time spent decreases the cost of the app for the customer, which is very important at the MVP stage.
There is no necessity for separate development for Android and iOS. Your application is launched using intermediate libraries. Therefore, the created applications work equally well based on iOS and Android. If there is a need to make any changes to a particular component, it will be updated for both platforms at once.
Further application support and development are easier. The number of specialists in the labor market familiar with React Native is growing day-by-day. Therefore, application support can be cheaper. And if necessary, later it will be possible to conduct it on its own, if the company has a qualified specialist in the staff.
React Native Cons
Applications are heavier. Since React Native is an intermediate in the ecosystem of software frameworks, an application developed in React will be somewhat larger than an app built using the native libraries from Apple or Google. So, if you create, for example, an Application for a loyalty program or for booking tables in a cafe, then on React Native, you will need not 15, but, say, 25-30 megabytes of phone memory. In most cases, however, this has little or no effect on how users rate the app, given the card's capacity and broadband speed.
A decrease in productivity is observed. Since any actions of an app developed in React Native go through intermediate libraries, their speed is slightly slowed down. However, if your mobile program does not carry out any calculations, then no one will notice the increase in processor load up to 2% instead of 1%.
Difficulties can occur when the size of the application is large enough. We are talking about a really complex software environment that takes up hundreds of megabytes of phone memory. It's the same with performance. The disadvantages of having additional infrastructure will only affect engineering or computing applications that code, perform some computation, or process large amounts of data right on the mobile device.
When to use NativeScript vs React Native?
What is NativeScript good for?
Your application is simple and consists of features common to iOS and Android.
You want to use Angular for web components.
You need your own custom interface, and you don't know Objective C or Java.
You are about to migrate to Angular or Vue mobile web app.
Famous NativeScript apps:
1. Daily Nanny. The app coordinates and monitors the babysitting and checks the condition of the children.
Once you have an idea for an application, create an MVP with NativeScript and test it in battle. You can quickly launch a cross-platform application with key features, and slowly develop a native application, monitoring changes in the market and user reactions.
2. Regelneef. The app monitors energy consumption and predicts next month's costs.
A mobile application for customers will increase loyalty by allowing them to control their accounts on a mobile device. And the chatbot integrated into the application will reduce the costs of salaries for consultants. You don't have to order native development for this. Perhaps your business needs are being handled by a mashup.
What is React Native good for?
You want to use your own interfaces to achieve your own performance
There are hardware features that you want to access through a specific platform (instead of third party plugins)
You want to create an MVP for the web and mobile very quickly (in 12 weeks, for example).
Some great examples:
UberEats. With the integration of React Native, an updated version of the Restaurants dashboard has become a familiar tool for most UberEats restaurants. This, in turn, has helped expand Uber's customer base and make UberEats one of the top food delivery services in the United States.
Walmart. With the help of React Native, Walmart wrote versions of the app for iOS and Android, hiring not 2 but 1 development team. Accordingly, they halved labor costs. Thanks to the fast development cycle (a real advantage of React Native), the team was able to accelerate the app's release date, beating the main competitors, and satisfy customers' needs.
As you can see, RN greatly outweighs NativeScript in many aspects. But you may have guessed, this comparison will not announce a clear winner. The verdict eventually depends on the availability of reliable and experienced professionals with knowledge of any structure.
When choosing between NativeScript and RN, keep in mind that as you develop your application, you may need to implement some changes to your own language to maximize platform-specific applications' performance and usability, especially if you are: recreating a robust, feature-rich application.