class App extends React.Component {
      state = {
        age: 29,
      }
      constructor(props) {
        super(props);
        console.log('constructor', props);
      }
      render() {
        console.log('render');
        return (
          <div>
            <h2>
              Hello {this.props.name} - {this.state.age}
            </h2>
          </div>
        );
      }
      componentWillMount() {
        console.log("componentWillMount");
      }
      componentDidMount() {
        console.log("componentDidMount");

        // state 를 update 시켜주니까 render 가 다시 호출 되고 있다.
        setInterval(() => {
          console.log('setIn')
          this.setState(state => ({
            ...state,
            age : state.age + 1
          }))
        }, 1000);
      }

      componentWillReceiveProps(newxtProps) {
        console.log("componentWillReceiveProps", newxtProps);
      }

      shouldComponentUpdate(newxtProps, nextState) {
        console.log("shouldComponentUpdate", newxtProps, nextState);

        return false;
      }

      componentWillUpdate(newxtProps, nextState) {
        console.log("componentWillUpdate", newxtProps, nextState);
      }

      componentDidUpdate(prevProps, prevState) {
        console.log("componentDidUpdate", prevProps, prevState);
      }
    }

    ReactDOM.render(<App name="Malza"/>, document.querySelector('#root'));

// shouldComponentUpdate 에서 return 을 false 로 해 놓으면, console 에서 age는
// 계속 update 되지만 실제 화면에는 reRender 되고 있지 않다.

constructor {name: 'Malza'}
componentWillMount
render
componentDidMount
setIn
shouldComponentUpdate {name: 'Malza'} {age: 30}

// shouldComponentUpdate 에서 return 을 true 로 두면 계속 reRender 된다.

constructor {name: 'Malza'}
componentWillMount
render
componentDidMount
====================================================================== 한 사이클
setIn
shouldComponentUpdate {name: 'Malza'} {age: 30}
componentWillUpdate {name: 'Malza'} {age: 30}
render
componentDidUpdate {name: 'Malza'} {age: 29}
====================================================================== 한 사이클
setIn
shouldComponentUpdate {name: 'Malza'} {age: 31}
componentWillUpdate {name: 'Malza'} {age: 31}
render
componentDidUpdate {name: 'Malza'} {age: 30}