facing slowness in user actions done through thunk middleware

Hi,

Anyone facing slowness in user actions. Sometimes a user action might dispatch many actions. Every action causes rerender of react.

const setAction()=>{
return async (dispatch, getState) =>{
     await dispatch(setAction1);
      dispatch(setNormalAction1);
      dispatch(setNormalAction2);
     await dispatch(setAction2);
     await dispatch(setAction2);
}
}

I am using above pattern of actions with redux-thunk.

One option of redux-batched-subscribe in middleware helped in batching concurrent actions( setNormalAction*) and hence saved some renders. But still the performance is bad because of sequence required in thunk actions(setAction1*).

Any other approaches, you are following to scale this?

[phpeek]

No, but mine is a normal connected component with redux-thunk middleware.

Gotya.

In that case You’ll see rerender of Your component every time You dispatch an action which changes part of state that component is connected to.

What I usually do is extract logic contained in actions to methods and execute them in necessary order. Then when all data is ready, dispatching single action with this data.

This might not be the case for You, as from what I see, Your actions depend on data in state set by other actions. In that case You might consider connecting Your component to part of state that is being changed by the last dispatched action. But again, this is very dependent on the way how Your state is designed.

I would need to have more specific examples, so that I can fully understand Your use case.

This is not an issue of RSK itself, it’s just how redux works. 😉

[ulani]

@shishirarora3 thank you very much for crating this issue! Unfortunately, we have close it due to inactivity. Feel free to re-open it or join our Discord channel for discussion.

NOTE: The main branch has been updated with React Starter Kit v2, using JAM-style architecture.