memo on Square would help in avoiding the Square component function to run when the App or Row component state changes. If memo is not used React would run each component function to build the tree and check if any dom update is needed. There wouldn't be any dom update even if we skip memo but the component functions would still run and can be costly if it involves a large number of components or complex logic to render each component.
memo
onSquare
would help in avoiding theSquare
component function to run when theApp
orRow
component state changes. Ifmemo
is not used React would run each component function to build the tree and check if any dom update is needed. There wouldn't be any dom update even if we skipmemo
but the component functions would still run and can be costly if it involves a large number of components or complex logic to render each component.I was specifically talking about that example, with this specific Square component.