React Native

Mobile App Development

React Native Development - The 12 Primary Characteristics

In this article we are going to go through all the pros and cons of the React Native technology for the purposes of application development. The categories which we are going to use for comparison are the same categories used for the Mobile App Development page. 

To learn more about other app development technologies (e.g. Flutter, React Native, Swift etc.) go to the Mobile App Development page.

INTEGU - React-Native

Table of Contents

1. Hybrid

React Native is a hybrid technology, which allows the developer to write JavaScript code in the React framework and compile it to Native iOS and Android apps.

It should be said that even though its framework appears as the normal React framework, it is not the same. It is therefore also important to note that a React Native project can only be used for mobile development. The code can therefore not be reused for a website (unlike Flutter).

React Native works by accessing native components through their APIs. There is therefore no html div tags in the markup, since it is not a webview. Instead you will have tags like button, text, and fab (floating action button), which correspond to native components.

2. Development Cost

As a hybrid technology, React Native automatically gains the cost advantage, when compared with native technologies, that only one code base will be necessary.

React Native has been the most popular non-native technology over the past 4-5 years (only recently overtaken by Flutter), and its community is therefore also well established. A lot of resources can be found online, both in terms of external packages, online courses, e-books etc. All of which will assist in keeping the development phase going at a steady pace.

One code base and a strong community should ideally help keeping the cost of development to a minimum.

3. Programming Language

React Native applications are written in JavaScript using a framework which shares many similarities with React.

Instead of regular html markup, it instead uses a markup language where div tags have been replaced by native component tags.

The React Native framework is limited in the sense that it can only be used for writing mobile applications. However, since it is based on a modern programming language (JavaScript) and works similarly to the regular React framework, it is neither difficult to get into nor to reuse the React Native skills in other projects.

4. Page-By-Page Adoption

React Native can be built into an existing native application. Airbnb is a good example of this. However, this means that you will of cause also have to support three types of mobile technologies. (iOS, Android, and React Native) So although it is possible it is perhaps not recommendable. According to Airbnb a substantial amount of work has to be put into the bridging infrastructure between the React Native and the native parts.

This would of cause not be the scenario if the application was built from scratch in React Native.

5. Supporters

React Native is supported and maintained by Facebook.

Recently the developer environment of React Native have changed a lot. Airbnb, which have previously vowed to React Native, have decided to leave behind the technology in favor to native technologies. This decision might have unforeseeable reactions on the adoption of React Native, since Airbnb were one of the biggest IT companies to utilize the technology.

Meanwhile, other companies, such as Shopify, have decided to start adopting the technology in favor of two separate code bases.

Whether this is an economical decision or a matter of superior technology choice, is difficult to say, but nevertheless React Native’s support base is going through period of change.

INTEGU - Facebook

6. Open Source

React Native is open source. The repository can be found here.

As it is possible to see from the repositories network graph, it is mostly developed and maintained by people associated with Facebook.

7. Device API-Access

React Native requires bridges to be build or implemented in order for the JavaScript project to access native features (e.g. camera, GPS, sensors). These bridges are available, but requires and additional step, when compared with Android or iOS.

Although React Native comes with some simple packages to implement when working purely with React Native, it can however become a hassle, if the application is built onto a native application. According to Airbnb it is a substantial amount of work that have to be put into the bridging infrastructure between the React Native and the native parts.

8. Performance

Performance achieved by React Native, it comparable to Android and iOS, since the final app will be written as native.

According to Airbnb, React Native suffers from some minor problems in terms of initialization time if the application gets to a relatively large size. However, unless you are going to build a huge app on a very competitive market, I would not consider this a limitation in the choice of technology.

9. UI Consistency

React Native in itself does not come with UI consistent components. However, with the implementation of a few external packages, you will be able to achieve automatic UI consistency.

Given that React Native is actually hooked up to native UI components, it also provides them with the same benefits as a native project in terms of configuration.

10. Hot Reload

React Native originally supported live reloading, similar to many other web development technologies. Live reloading is triggered when changes in the code are detected and causes the entire application to be reloaded. This therefore also causes the state of the application to be lost.  

At a later point in time, React Native have been upgraded to support hot reloading. In contrast to live reloading, hot reloading only refreshes the files which have changed, which therefore enables the application to remain in the same state.

11. Require Native SDK

React Native requires both the Android and iOS SDK, as well as its own React Native Facebook SDK.

If you prefer not to download the native SDKs there is also another option to quickly get your React Native on a physical device. React Native can utilize Expo for Android and the regular camera for iOS to load the app directly on physical device through cloud-based development environment. If you want to use a local simulator, it is required to install the respective native SDK.

12. Require Specific IDE

With React Native it is possible to select your preferred web development IDE.

Dependent on which one you choose, you might be able to find special plugins or tools, which will improve the experience of developing with React Native. However, from an objective perspective, this is probably more a question of individual preference. React Native does not recommend an IDE.

When you eventually want to deploy your application to a physical device, it might be necessary for you to download and install Android Studio or Xcode. However, using the Expo tool can help you get past the deployment without having to work in any of the native IDEs.

Recommended Reading

Article

  • React Native – Website – React Native – Blog
  • Expo – Expo – Blog
  • Best IDE for React Native? – Tremaine Eto – Blog
  • Getting Started – Facebook – Blog
  • Introducing hot reloading – React Native – Blog
  • Airbnb – What is next for Mobile? – Gabriel Peal – Blog
  • Airbnb – Sunsetting React Native – Garirel Peal – Blog
  • React Native – Network Graph – GitHub – Blog
  • React Native – Repository – GitHub – Blog
  • Airbnb – React Native – Gabriel Peal –  Blog
  • React Native is the Future of Mobile Development – Shopify – Blog
  • Stack Overflow trends – Stack Overflow – Blog

Video

  • What is React Native? – LevelUpTuts – YouTube

Book

About

Hi, I'm the Author

My name is Daniel H. Jacobsen and I’m a dedicated and highly motivated software developer with a masters engineering degree within the field of ICT. 

I have through many years of constantly learning and adapting to new challenges, gained a well-rounded understanding of what it takes to stay up to date with new technologies, tools and utilities. 

The purpose of this blog is to share both my learnings and knowledge with other likeminded developers as well as illustrating how these topics can be taught in a different and alternative manner.

If you like the idea of that, I would encourage you to sign up for the newsletter.

Cheers! 🍺

Didn't Find What You Were Looking For?

Generic selectors
Exact matches only
Search in title
Search in content
Search in posts
Search in pages
Scroll to Top