React Hooks : useMemo(), useCallback() 불필요한 재랜더링 줄이기

useMemo()

메모이제이션된 값을 반환한다.

💡 메모이제이션이란?

컴퓨터 프로그램이 동일한 계산을 반복해야 할 때, 이전에 계산한 값을 메모리에 저장하고, 

동일한 계산 반복 수행을 제거한다.

함수, 의존성 값의 배열

의존성이 변경되었을 때만 메모이제이션 된 값만 다시 계산한다.

useMemo로 전달된 함수는 랜더링 중에 실행된다. (통상적으로 렌더링 중에 하지 않는 것을 함수에서 하지 않는다.)

 

useCallback()

메모이제이션된 콜백을 반환한다.

콜백의 메모이제이션된 버전을 반환한다.

메모이제이션된 버전은 그 의존성 배열이 변경되었을 때만 변경된다.