[ React ] React.PureComponent

React.PureComponent

• ShouldComponentUpdate 라이프 싸이클 메소드가 이미 적용된 클래스

React.Component와 차이점

• React.Component 는 ShouldComponentUpdate 메소드를 별도로 선언하지 않았다면 props, state 값이 변경되면 항상 re-rendering 한다.

• React.PureComponent 는 ShouldComponentUpdate 메소드를 선언하지 않아도 PureComponent가 Shallow level 에서 props 와 state 를 비교하여 값의 변경이 있을 때만 re-rendering 한다.

React.Component와 공통점

• 클래스 기반의 컴포넌트 생성 방법.

• 차이점을 제외한 모든 것이 동일하다.

@observer와 PureComponent

• mobx-react의 @observer를 사용할 경우 PureComponent와 유사하게 props의 얕은 변화를 감지하고 변경이 있을 때만 re-rendering 한다.

• PureComponent와의 차이점은 state의 변경은 항상 re-rendering 한다는 것이다.

• @observer 사용시 PureComponent를 사용하면 warning이 발생한다. PureComponent 대신 Component를 사용한다.

출처
https://reactjs.org/docs/react-api.html#reactpurecomponent
https://www.vobour.com/book/view/j4oN4z3iP4hKdMdEt
https://mobx.js.org/refguide/observer-component.html#-observer-and-purecomponent