Work can be a fun when we know and understand each other well. Let's start conversation to new beginning
+91 63542 35108
To discuss what we can do for you Give us a Call
Tell us about your next project Write to us
In a recent blog published by React Native, it has been announced by the team there will be a new architecture going to roll out in 2022. The announcement came just after the React Native team released version 0.67 last month. I have already discussed the new changes brought in by v0.66 last month.
However, many other releases are expected from the development team of React Native in 2022. So, it’s the right time to know and understand the changes that are taking place under the hood, which may affect your React Native application.
This article covers the most important changes bought by this re-architecture and what’s expected out of it. But first, let’s understand the current architecture of React Native:
An entity called a bridge makes the communication between the JS and Native Threads possible. The data, while sent through the bridge, should be optimized and serialized as JSON to handle asynchronous communication.
Now, let’s cover the important changes the New Architecture of React Native will bring with itself:
Also, the data sent through the bridge is in an asynchronous state, which is good for most cases but not when the JS code and native code need to be in a synchronized state.
Suppose, a React Native app that is based on the current architecture requires access to a native module. First, the JS thread has to send a serialized JSON message to the bridge, which will be optimized on the way to the Native thread. Then, it’ll be decoded and finally, the native code is executed.
In essence, the JSI will enable the use of other JS engines and implement complete interoperability. Also, being written in C++ means React Native can target large systems such as Smart TV, Wearables, etc.
The Fabric in the new architecture will replace the UI manager from the current architecture. Fabric is a rendering system the new architecture will introduce this year.
Since we all know that all the communication in the current architecture happens over the bridge, which means slow transfer rates and unnecessary data copying.
Also, the JS and UI threads are not in sync, there are instances when your apps may seem laggy due to the drop in frame rate.
According to the React Native official documentation,
Fabric is React Native’s new rendering system, which is a conceptual evolution of the legacy render system.
The benefit of this new rendering system is that the user interactions such as scrolling, gesture, etc. can be prioritized.
All of the above upgrades in the New Architecture for React Native sound promising. However, the JS is a dynamically typed language whereas C++ is a statically typed language using which JSI is also written. Thus, there needs a module that can smoothen out the communication between the two.
That’s where CodeGen comes in. It is a static type checker which will define interface elements Turbo Module and Fabric may use. Also, it will generate additional native code at build time than the run time.
So, the key highlights that are expected from this change of architecture by React Native are the elimination of bridge and introduction of JSI, swapping JSCore with other engines, complete interoperability, web-like rendering, Turbo Modules, and static type checker. All these improvements and enhancements are sure to bring more power to the React Native apps.