useMemo

React Hooks 5.useMemo

useMemo란? component 성능을 최적화 하기 위해 사용한다! 동일한 값을 리턴하는 함수를 반복적으로 호출한다면 맨처음 값을 계산할때 해당 값을 메모리에 저장해 재사용하는 기법이다. useMemo의 구조! 기본적으로 첫번째인자는 callBack함수를 받으며 return값을 반환해준다! 두번째 인자인 배열은 의존성 배열로 언제 업데이트 할지를 설정할수 있다. 빈배열이라면 맨처음 렌더링 될때 함수가 작동하며 그 때 계산한 값을 사용한다. 위의 사진과 같이 [item] 요소의 값이 업데이트 될때 다시 함수가 작동한다! 계산기로 알아보는 useMemo! 결과화면! 왜일까? 어려운 계산과 쉬운계산 모두 딜레이가 있다. 어려운 계산은 고의로 속도를 지연시키기 위해 큰수를 반복하도록 설정해놓아 딜레이가 생기..