useCallback

useCallback 또한 메모이제이션을 통해 컴포넌트의 성능을 최적화 시켜준다.

인자로 전달한 콜백 함수 자체를 메모이제이션 해주는 것.

• useMemo는 값을 메모이제이션 해주고, useCallback은 함수를 메모이제이션 해준다.

함수형 컴포넌트

<Component / > 렌더링 → Component 함수 호출 → 모든 내부 변수 초기화

함수형 컴포넌트 속 함수를 useCallback()으로 감싸주면?

<Component / > 렌더링 → Component 함수 호출 → Memoize 된 함수를 재사용

기본 API

함수도 매번 새로운 객체로 만들어진다.

컴포넌트 렌더링 사이에 값을 안정적으로 유지하는데 사용된다.

  useCallback(() => {
	  return value;
  }, [item])

• 첫번째 인자: 콜백함수
• 두번째 인자: 의존성 배열