score:1

Accepted answer
class component extends react.component {
  render() {
    return (
      <>
        <div classname="div1"></div>
        <div classname="div2"></div>
        {this.state.showdiv3 ? <div classname="div3"></div> : null}
      </>
    );
  }
}

the component itself will re-render (the render function will be called) because of setstate call.

for the components it renders, by default (props shallow comparison) only div3 will re-render (remount), see reconciliation.

if you switch the divs with custom components, you can memoize them by having a custom props comparison function (check react.memo/react.purecomponent/shouldcomponentupdate).


Related Query

More Query from same tag