Back to Blogs

Beyond Trial-And-Error: How React Native Works

Mobile App Development
Article
Technology, Information and Media

What many people know about React Native (RN) right now is that companies like Airbnb and Udacity tried it, critiqued it, and ultimately abandoned it. Like any app-building tool, highly publicized retreats generate media buzz. This is about as far from an objective, bigger-picture perspective as you can get.

Some organizations discontinue their use of React Native (for various reasons)–but some are realizing significant benefits from its utility and accessibility. It continues to collect a decent bouquet of compliments right alongside the negative noise.

A clear recognition of the pros, cons, and context around RN doesn’t just eliminate misconceptions. It helps ensure you’re objectively evaluating and recommending solid app development strategy.

Here’s what matters:

  • What is React Native, and how does it work?
  • When does React Native make good sense for your team and/or your projects?

The React Native Story

Originated in 2013 by Facebook, React Native (RN) is a code tool that builds true native apps, using JavaScript. RN uses an innovative approach that blends JavaScript business logic and flow control with native UI elements to achieve the same performance as regular iOS and Android apps.

Without getting too deep into technical jargon, the TLDR is that React Native is a faster, cleaner way to build flexible, responsive, cross-platform native apps. Many Fortune 1000 companies and small startups alike successfully leverage RN.

Cordova Made History. React Native Made it Better.

As mobile device technology skyrocketed, so did web developers’ interest in building mobile apps with JavaScript. With cross-platform app solutions continually evolving, various JavaScript frameworks emerged. Enter: Cordova.

Cordova provides a web browser in an app shell. It renders HTML, CSS and JavaScript, but comes saddled with a lot of restrictions. Cordova forces the app to use a web browser to draw all of its screens, instead of using the native UI layer. As a result, it rarely looks or feels native–user experience suffers.

The promise of React Native is taking the accessibility and cross-platform boons of Cordova and marrying them with real native rendering.

React Native is NOT React.

In order to understand how React Native works, the natural confusion between React and React Native needs to be addressed: While close relatives, they’re NOT the same thing. Both originated by Facebook developers, React (React.js) appeared first in 2011.

React is a JavaScript library, a framework for building web applications. It combines JavaScript with a speedy, new way of rendering a responsive web user interface. While the React concept forms its core, React Native uses the syntax and principles of React to enable the building of installable apps.

RN Platform Pros and Cons

The RN user experience is that of a native app–a smooth, responsive interface installed to your phone. On the flip-side, RN needs some workarounds and has some missing pieces.

The Desirables

  • Condensed learning curve: For front-end web developers, React Native is easy to pick up and allows them to seamlessly switch to mobile app development. If they are aware of platform-specific APIs and design patterns, and familiar with native UI elements, they’re ready to go.
  • Concise logic: Through it’s cleverly designed SDK, RN uses JavaScript to drive both business logic and the native user interface layer. The developer can take the same app logic from platform to platform, resulting in a more unified user experience.
  • Efficiency: RN doesn’t demand the cost and time required for maintaining separate Android and iOS code bases.
  • Native performance: Compared with other hybrid app development tools, RN offers higher performance, smoother animations, and sidesteps issues with browser compatibility.

Challenges and Pain Points

Every platform has limitations. There are reasons that developers and companies step away from RN:

  • The subtle difference. React Native apps will perform very closely to fully native apps’ level. This difference is below the radar for most users and use cases, but can be noticed with heavy data crunching or graphically-intensive experiences, like 3D.
  • Third-party licenses. React Native is built an on open source foundation and uses a variety of different projects with different owners and licenses. This involvement may prompt additional scrutiny from your legal team.
  • Feature workarounds. React Native doesn’t always get access to the latest and greatest features right away, and developers may need to do some extra native engineering to access some iOS and Android platform capabilities.
  • A few missing pieces. Currently, RN does not currently offer support for devices beyond phones and tablets, like Apple TV or Apple Watch.
  • Questions around longevity. While backing by Facebook and massive popularity offer some assurances, it’s impossible to say if React Native will still be maintained in 10 years.

Abandonment can’t always be taken at face value.

As previously mentioned, encountering articles like this one from visible brands like Udacity and Airbnb stirs the pot. They identify some of the problems they encountered with React Native, such as a less-than-streamlined integration with Android and its problematic organizational gaps. But there’s more to it.

Chances are, some of the development teams within these companies are still enthusiastic about and recognize RN’s potential in the grand scheme. What’s missing from these articles is the larger business context. Trying out and learning from new tools is a common tactic when companies are looking to change or coin their own development approach.

Creating an in-house version of a platform like RN that accommodates specific internal objectives certainly isn’t a bad plan if you can afford the engineering team to maintain it. Companies with massive brand equity and extensive development resources have the luxury to fully document and form a position on the tool trend of the moment. They also have the IT firepower to take the learnings from the exercise and develop their own tool.

Communicating RN App Strategy with Partners.

When sitting down with a partner to define app strategy, there are several important questions to answer:

  • Installation: What are the installation requirements for the app?
  • Control: How much control does the user have?
  • Experience: What type of user experience or interactivity do you envision?
  • Platform: Are you building for a specific piece of hardware, or do you plan for cross-platform functionality?

If there is a cross-platform goal paired with a desire for native feature functionality, React Native could present a very viable solution. Generally speaking, React Native’s popularity as a cross-platform solution for mobile development is far stronger than that of Cordova, Ionic, Xamarin, or Native Script.

It is essential to communicate the pros and cons around any platform and weigh them against partner objectives. Partners know they want to go to market. Much of the time, however, they don’t understand all of the considerations and potential obstacles along that journey. Development teams must be prepared to present a platform recommendation and guidance.

React Native Down the Road

Whether or not React Native is right for your app strategy depends on your internal goals and expectations, as well as your partners’ development expectations.

For many organizations, RN strikes the right balance between accessibility and user experience. It provides a native UI, while avoiding the high cost of developing and maintaining separate iOS and Android code bases. Its cross-platform capabilities offer an approach that makes sense for many companies.

Dan Nichols

Dan Nichols worked at Mutual Mobile as a Technical Director.

More by this author