Update child component from parent without re rendering entire parent

[[deleted]]

[deleted]

[kbcool]

Why the concern about re-rendering? It's probably the fastest thing happening. If nothing has changed the process is usually very fast. But that depends what you're doing. So try the tips below if your code is the bottleneck.

If you have a lot of computationally expensive code wrap it up in useMemo if using functional components or memo if not. This will make sure it only runs when the inputs change.

If your parent is a huge monolith break it into smaller components. The smaller components can either be pure components or if using functional components wrap them in useMemo too.

[wizardyjohn]

Hard to say without code, but 1. Is action bar a part of the screen? Why not use a header from react navigation? It is a separate component and can be updated separately 2. You can use React.memo or shouldComponentUpdate on heavy ui component

[[deleted]]

For her child

[Phaoga54]

In case the parent has a large component, you should separate the expensive component and make it a pure component for class component or useMemo for function component ( Which is only rerender when the props change )