One of the main advantages of cross-platform development is reduced cost and time by using the same code for both platforms.

BLOG | Nuances in React Native and Mobile Development

Nuances in React Native and Mobile Development

Today many companies prefer to build their applications using React Native as a solution because one can simply write all of the code in JavaScript and share it across Android and iOS. In this article, we are going to talk about the pros and cons of choosing React Native as the framework to create such applications and briefly explain how far we’ve come since its inception.

<h2>A Brief History of Mobile Development</h2>

Not that long ago, to develop mobile applications for both Android and iOS a company needed at least two developers that were able to code in the native language of those operating systems. Many issues came from such an approach &#8211; differences between versions, code, and team coordination. Needless to say, companies were paying double the money for the price of (almost) the same product.
Thus, great minds began to ponder: “How can we have one dedicated team, with one tech stack and one code base that works on both operative systems?” Among the first ideas came <a href="https://www.nngroup.com/articles/responsive-web-design-definition/" target="_blank" rel="noopener">responsive web development</a>: to use the same web application adapted for small screens. While this was practical for static web applications, interaction with users was limited, and dynamic applications were performing poorly.

Disadvantages of responsive web development:
<ul>
<li>Application’s capabilities depended heavily on the device’s browser</li>
<li>Dispensing functionalities that employed the device’s hardware was most of the time, out of the question</li>
<li>The application must be optimized to provide stability, speed, and security on the same level as its web counterpart</li>
</ul>

Afterward, frameworks for hybrid mobile development like <a href="https://cordova.apache.org/" target="_blank" rel="noopener">Apache Cordova</a> came along, but by still relying on the browser’s capabilities to display content and provide functionality, the disadvantages mentioned above remained.

<h2>Mobile OS Market Landscape Shift</h2>

From 2009 onwards, market-share of mobile devices was segmented, and operating systems as Symbian, Rim, and Microsoft had a big presence with their editions of mobile devices.
Developers had to focus on a single framework and codebase that was native to the device. Given that the hybrid development options offered poor user experience, teams choose the native way.
Years later, this paradigm was maintained by the two biggest players: Android and iOS, and developers coded in either Java or for Android or Objective-C for iOS to make use of all the device’s native capabilities and provide a better user experience.

First launched by the Social Media behemoth in 2015, it quickly became the most popular solution for mobile development. It provided what users wanted: flawless performance, aesthetic appeal, and seamless navigation – and what developers wanted: a single code to work on for everything.

React Native applications are written in Javascript which makes the transition from web development to mobile development easier. But, the final application that is compiled and run in the device employs native code (Java for Android and Objective-C for iOS), hence the “Native” in the framework’s name.
Every React Native application has two important streams:
<ul>
<li>The main thread. This runs on every native application and takes care of displaying UI elements and handling user gestures.</li>
<li>The Javascript thread. It executes Javascript code in a separate engine and is the one that deals with the business logic of an application – what it does and how it does it.</li>
</ul>
Those two streams communicate using a bridge, an intermediary that takes care of handling requests from both sides in an asynchronous way. This protects both threads from blocking each other and provides stability to all operations within the application.

While this process seems straightforward, it came to be what it is today after a series of iterations – a lot of trial and error, as converting Javascript code to native code was challenging at the beginning, and what worked best on the first versions of React Native may not work anymore in the latest ones.
Developers who had to work with applications built in the first stages of React Native were posed with migrating features to the newest versions. This process wasn’t always seamless and the decision between building an application all over again or continuing coding in native languages was always pondered among teams.

A particular pain point that came with React Native was making it work properly with existing code. While a web development team could be leveraged for this, the probability that sooner or later that team would be developing in native code was always high.
Despite having vast support from communities and big tech companies in the form of a wide array of libraries, a certain feature that used to work in previous versions of React Native may be no longer maintained. This means having to either modify the library to fill the gap of the maintainer or having to build it up from scratch.
Despite the troubles, there are many advantages to having a dedicated community providing libraries to solve different problems. Gesture handling, permission requests, video reproduction, and secure storage management are a few of the most common features in mobile applications. In this regard, the improvements in the popular libraries used for them have come a long way and are very well maintained to this day.
But, that’s the case for legacy code. What about starting a new app from scratch today in 2022?
Let’s take a look at some perks of working with React Native.

React Native’s bridge allows developers to take advantage of the native functionalities of the device with a few lines of Javascript code. Furthermore, the Javascript engine takes care of running the tasks that do not rely on the main thread.
This means that business logic and basic functionalities like login, data fetching, and content generation can be entirely coded without installing additional React Native libraries (some already exist in the React ecosystem and work just fine).
The real deal comes when compiling the bundles that will go to the Google Store (Android) and App Store (Apple) respectively.
While there are many options among the IDEs to use, VSCode from Microsoft is the most popular environment used in 2022. Therefore, we will use it as our starting point for the development journey.
For Android, employing the Android Studio editor and engines is the mandatory step for testing and bundling. As always the advantage here is that any PC will do for development as these programs are hardware agnostic.
For iOS, the only path is still to work on a Mac device with Xcode. Testing can be done using a simulator but for a real-life experience, a mobile device (iPhone) is preferred. On this last step, Xcode is more deployment-friendly than Android Studio as it makes the process of bundle signing and uploading seamless.

While React Native is not the perfect solution for every use case in Mobile Development, it is a good option for development given the platform’s community support and ongoing development.
At the moment, 42% of mobile app developers use React native according to the last survey made by Stack Overflow in 2020 and with every upgrade, new features are covered.
Last but not least, being open-source not only allows developers outside Facebook to improve it but also verify that no malicious code is introduced in it. The broader React Native community is dedicated to making React Native work for hybrid apps at scale and progress is faster than ever. Just in the first half of 2022, there were more than 1000 commits in Github to its repository.
Long-awaited features such as a proper mobile app debugger (Flipper), upgrading tools (Upgrade Tool), and new Pressable Component for different types of touchscreen interaction are now available and ready-to-use for developers.
But given how fast-paced is the world of mobile development (and development in general) the question lingers: Will something better come to replace React Native in the future? Maybe, but for now, it is a solid bet to build products and services for users of the two most widely used operating systems in the mobile world.