Does react-native support Multithreading and Background threading or Parallel Execution? How can we do that?

Question

I have gone through the official documentation of react-native and some other medium sources and blogs, I came to know that there is UI Thread and JavaScript Thread in react-native. Javascript thread is the thread where the logic will run javascript code is executed, API calls are made, touch events are processed and many other. And UI Thread updates the UI. If JavaScript thread is working on the process and if we again perform button action or any other touch event it takes some time to respond, after completing one process only the UI Updates until than I feel like its lagging or it's stuck somewhere.

For example

There is a bottom tab navigator it has four tabs, There is a listview in the first tab and map view which shows the route between multiple points in the second tab

I had performed some button action(clicked like button in the list view) in the first tab and immediately navigating to the second tab, It feels some lag in updating UI or it takes some time(1-3 sec) to navigate from the first tab to the second tab

In the second tab the map takes time(5-10 sec) to fetch route between multiple points when this process is going on if I navigate to any other tab the navigation between tabs is not smooth and lots of UI lag is present.

How can we make the react-native app respond faster to touchable actions and reduce UI lag

Is there any concept of Multithreading and Background threading that we can run particular logics in the main thread and update UI to make a react-native application to respond faster without any lag.

Disyllable

Answer 1

It is not possible to use threads in react-native but you can use third party packages like react-native-bg-thread for performance optimisation

Astute

without using 3rd party libraries can we handle it – Disyllable

Using multiple threads is impossible in react native you will have to use native code to perform some functionalities in separate threads otherwise you will have to use third party packages.. – Astute

Answer 2

React Native uses javascript wich is a single threaded language so in theory there shouldn't be a way to use multiple threads. If something is blocking the js thread you should move that code to native side implementing it in objective-c/swfit and java/kotlin so then you will be able to run that on a native thread and preventing the lock of the js thread. Anyway after Reanimated 2 was released the worklet apis made possibile to create this library which allows to create other js threads to run code and not blocking the main one

Kurtzman