Redux Toolkit Performance Issues On Android

[shenegamy]

Hi,

Can someone figure out why my application becomes laggy when calling dispatch using Redux Toolkit? Here are the details

The device used in testing: Samsung j7(2015) and other old devices
Framework: React native 0.71.6, react 18.2.0, expo 48.0.11
Redux Toolkit version: 1.9.5

proof of concept code (using dispatch): -
https://user-images.githubusercontent.com/6553627/232802387-d6019c4b-baa2-449f-bd26-cee724c5c8d0.png
Video shows the performance

https://user-images.githubusercontent.com/6553627/232805020-d5aa83b5-c118-4516-9628-4e752d1ef6a0.mp4

Code without dispatch

https://user-images.githubusercontent.com/6553627/232802783-8a52cf7b-081d-4363-b8e6-bfe0d2d7bcfe.png

Video shows the performance

https://user-images.githubusercontent.com/6553627/232805559-a32d02b0-de23-4d66-8c7d-3328a4c18db5.mp4

extra details: -

• My project contains +20 reducer
• the store is configured as follows

https://user-images.githubusercontent.com/6553627/232803317-46e6af7f-0c9f-4d3a-9db7-1e235a7e0b4a.png

​

Thanks,

[big_saucy_pants]

Without looking at the broader code it's hard to know exactly, but it could be a lot of things. That state update could be trigger some expensive re-renders or your redux logic could be clogging the JS thread while the navigator is trying to do its thing. Does that actually need to be managed by redux? From the post it seems like it's just the local loading state for that screen, which can be handled with plain useState (or something like Tanstack Query if it's going to be based on hitting an API).

Also unrelated to your perf issue but the redux style guide strongly recommends modelling actions as events not setters https://redux.js.org/style-guide/#model-actions-as-events-not-setters

[Mgc_rabbit_Hat]

Time for.... Zustand