React Native

Last updated 9 months ago

Was this helpful?

Introduction

React Native is a platform that allow developer to write code in reactJS, but can execute in native view on both platform
Learn Once, Write Everywhere

Most of the native code in case of iOS is written in Objective C or Swift, while in the case of Android it is written in Java or Kotlin. But for writing our React Native app, we would hardly ever need to write native code for iOS or Android.

In most cases, React Native will use , an open-source JavaScript engine optimized for React Native
Engine will be bundled as an app so as to execute the javascript code

Main thread (Native Queue) - This is the main thread which gets spawned as soon as the application launches. It loads the app and starts the JS thread to execute the Javascript code. The native thread also listens to the UI events like 'press', 'touch', etc. These events are then passed to the JS thread via the RN Bridge. Once the Javascript loads, the JS thread sends the information on what needs to be rendered onto the screen. This information is used by a shadow node thread to compute the layouts. The shadow thread is basically like a mathematical engine which finally decides on how to compute the view positions. These instructions are then passed back to the main thread to render the view.
Javascript thread (JS Queue) - The Javascript Queue is the thread queue where main bundled JS thread runs. The JS thread runs all the business logic, i.e., the code we write in React Native.

React Native bridge is a C++/Java bridge which is responsible for communication between the native and Javascript thread.
React Native CLI would spawn a node packager/bundler that would bundle the JS code into a single main.bundle.js file. The packager can be considered as being similar to Webpack. Now, whenever the React Native app is launched, the first item to be loaded is the native entry point. The Native thread spawns the JS VM thread which runs the bundled JS code.
When React Native app is launched, the first item to be loaded is the native entry point. The Native thread spawns the JS VM thread which runs the bundled JS code. The JS code has all the business logic of the application. The Native thread now sends messages via the RN Bridge to start the JS application.
The spawned Javascript thread starts issuing instructions to the native thread via the RN Bridge. The instructions include what views to load, what information is to be retrieved from the hardware, etc.
The native thread will perform these operations and send the result back to the JS assuring that the operations have been performed.

Last updated 9 months ago

Was this helpful?

React Native is a platform that allow developer to write code in reactJS, but can execute in native view on both platform
Learn Once, Write Everywhere

Most of the native code in case of iOS is written in Objective C or Swift, while in the case of Android it is written in Java or Kotlin. But for writing our React Native app, we would hardly ever need to write native code for iOS or Android.

In most cases, React Native will use , an open-source JavaScript engine optimized for React Native
Engine will be bundled as an app so as to execute the javascript code

Main thread (Native Queue) - This is the main thread which gets spawned as soon as the application launches. It loads the app and starts the JS thread to execute the Javascript code. The native thread also listens to the UI events like 'press', 'touch', etc. These events are then passed to the JS thread via the RN Bridge. Once the Javascript loads, the JS thread sends the information on what needs to be rendered onto the screen. This information is used by a shadow node thread to compute the layouts. The shadow thread is basically like a mathematical engine which finally decides on how to compute the view positions. These instructions are then passed back to the main thread to render the view.
Javascript thread (JS Queue) - The Javascript Queue is the thread queue where main bundled JS thread runs. The JS thread runs all the business logic, i.e., the code we write in React Native.

React Native bridge is a C++/Java bridge which is responsible for communication between the native and Javascript thread.
React Native CLI would spawn a node packager/bundler that would bundle the JS code into a single main.bundle.js file. The packager can be considered as being similar to Webpack. Now, whenever the React Native app is launched, the first item to be loaded is the native entry point. The Native thread spawns the JS VM thread which runs the bundled JS code.
When React Native app is launched, the first item to be loaded is the native entry point. The Native thread spawns the JS VM thread which runs the bundled JS code. The JS code has all the business logic of the application. The Native thread now sends messages via the RN Bridge to start the JS application.
The spawned Javascript thread starts issuing instructions to the native thread via the RN Bridge. The instructions include what views to load, what information is to be retrieved from the hardware, etc.
The native thread will perform these operations and send the result back to the JS assuring that the operations have been performed.