DEV Community

loading...

Does Redux minimize re-rendering?

sunflower profile image sunflowerseed ・1 min read

Is it true that one big advantage about Redux is, it can minimize the re-rendering of components?

If we let the whole App use a context, and every single component in the app can access or change anything in the context, that'd be good for sharing data, but is it true that any change to any data in context will cause the whole App (and offsprings) to re-render? (not to update the actual DOM, but virtual DOM diff'ing / reconciliation first, and any difference, update the actual DOM).

And what about using Redux? Then it will only cause the minimum amount of re-rendering? So it won't be from the App and all the way down to every component under App?

Discussion (3)

Collapse
jannikwempe profile image
Jannik Wempe

Hi, maybe you want to take a look at my comments at this post.

There are some explanations and additional resources.

Collapse
sunflower profile image
sunflowerseed Author

So I guess in your comment you do mean that context causes everything to be re-rendered (if App uses one context and store all data in it for the app)... and even if we split the context into 2, it could still cause half of the components to re-render (unnecessarily).

And so Redux is better... it only causes any component that is "connected" to be re-rendered? (I am still reading up more on Redux).

Collapse
jannikwempe profile image
Jannik Wempe

As far as I know:

All components using a context will rerender if the context changes. So you should not use one big shared context but only store related information in the same context (e.g. theme, auth, used language; these are common use cases).

Also you don't want to use context if it's state changes frequently (e.g. inputs, some frequently calculated values...).

I only use redux if there is some global state which can change frequently. Otherwise I prefer the context API + hooks.

Forem Open with the Forem app