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.
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
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With