Life Cycle

Class Component	funtional Component
this.setState	useState
render()	return
memory 많이 사용	memory 적게 사용
this.props	{props} argument
constructor	mount (메모리에 load되는 것)

class형 component: constructor -> componentWillMount -> render -> componentDidMount(painting) -> componentWillUnMount

 

class형 component (props변경시) : this.props-> ComponentWillReceiveProps -> shouldComponentUpdate(Re-rendering) ->comPonentWillUpdate (props가 update시) -> render -> componentDidUpdate

 

함수형 component: mount(load) -> render(return) -> (useLayOutEffect) -> paint(DOM) -> (useEffect) -> end(useEffect의 return)

 

함수를 유닛테스트하기위해선 순수함수가 굉장히 유리하다!

 

react window챕터 꼭 보기