2021.02.10 / React - create : shouldComponentUpdate

생활코딩 19.7강 - create 구현 : shouldComponentUpdate

 

프로그램이 커지면서 성능을 향상하고 싶을 때 render() 함수가 실행될지 실행되지 않을지

리액트로 코드를 작성하는 개발자가 결정할 수 있도록 특수한 약속의 함수를 제공한다.

그것을 shuldComponentUpdate(){} 라고 한다.

이 함수는 2개의 매개변수를 받도록 약속되어있다.

이 함수를 씀으로써 해당 클래스에 데이터라고 하는 props의 값이 바뀌었을 때

render()가 호출되고 바뀌지 않았을 때는 호출하지 않아 불필요한 호출을 막는다.

shouldComponentUpdate(newProps, newState){
    console.log('==> TOC render shouldComponentUpdate'
    newProps.data
    ,this.props.data
    );
    if(this.props.data === newProps.data) {
      return false;
    }
    return true;
 }

 

 

참고

- www.youtube.com/watch?v=SLb4p9T-yZA&list=PLuHgQVnccGMCRv6f8H9K5Xwsdyg4sFSdi&index=34