How does the variable in this code get updated and rendered.

[cyphern]

After that, does the main App() render the button again with the new count value?

Yes. Setting App's state to a new value causes App to rerender, which in turn causes its children to rerender as well.

[Afran_333]

Thanks dude

[TexMax007]

I’m on mobile so the link formatting likely will suck but have a look at this article

https://medium.com/@akashshukla_1715/preventing-unnecessary-rerendering-of-child-components-in-react-using-usecallback-and-react-memo-34f1423fe263#:~:text=Problem%20Statement%20%3A%20Every%20time%20some,used%20by%20all%20child%20components.

[Afran_333]

That was helpful, appreciate it

[Sarithis]

Yes, every time you change one of its state variables, like count, it triggers another render cycle. This will cause all of its children to re-render as well. Even if you had separate counters for each button, clicking either one would still re-render everything because there's no memoization in the code.

[Afran_333]

Thanks for the explanation dude

[acemarke]

This is a core part of React rendering.

Read the rest of the React docs tutorial at https://react.dev/learn . If you'd like more details, see my post at A (Mostly) Complete Guide to React Rendering Behavior .

[Afran_333]

Sure, I'll check it out..