REACT NATIVE NEW ARCHITECTURE
React native new architecture (0.68) is releasing 2022 which has some of the new terms like JSI, FABRIC, TURO MODULE and codegen. here we will do a comparison of existing architecture vs New.
JSI ( Javascript Interface)
FABRIC
TURBO MODULE
CODE GEN
JAVASCRIPT INTERFACE (JSI)
Current Architecture :
- There was a bridge between the JavaScript thread and the Native thread
- Interaction between JS thread and Native thread is asynchronous
New Architecture :
- The bridge will be replaced by JSI
- JSI decoupled from Javascript Engine
- JSI has written in C++
FABRIC
Current Architecture :
- Using Bridge interact between JS thread and Native thread
- Slow Transfer Rate
- Performance issues on some of the use cases like implementation Scrolling list due to JS & UI threads are not in Sync.
New Architecture :
- FABRIC — new Rendering system
- UI interactions executed synchronously
- The shadow tree will be immutable and shared between JS & UI threads
TURBO MODULES
Current Architecture :
- All the Modules need to be preloaded before the App starts, it will cause the performance issues when the app launches
New Architecture :
- Holds the reference of the modules and allows them to load whenever required.
- Improve the start time of the Applications.
CODEGEN
- Automate the compatibility between the JS thread and Native Thread
- Generate native code at build time instead of run time
- Define Interface elements used by Turbo Module and Fabric
Video Link: https://youtu.be/UUmOokzt-uM