useMemo, useCallback, React.memo를 간단하게 비교할 수 있다.
| 특징 | useMemo | useCallback | React.memo |
|---|---|---|---|
| 역할 | 값 메모이제이션 | 함수 메모이제이션 | 컴포넌트 메모이제이션 |
| 사용 위치 | 컴포넌트 내부 | 컴포넌트 내부 | 컴포넌트 외부 |
| 주요 목적 | 계산 비용이 큰 작업 최적화 | 자식 컴포넌트에 전달되는 함수 인스턴스 유지 | 부모 컴포넌트의 불필요한 렌더링 방지 |
| 의존성 관리 | 의존성 배열 필요 | 의존성 배열 필요 | props가 변경될 때만 다시 렌더링 |
| 사용 예시 | 배열 합산, 정렬, 필터링 | 이벤트 핸들러, 콜백 함수 | props가 동일한 자식 컴포넌트 |
| 주의사항 | 불필요한 사용은 성능 저하 | 의존성 배열 설정 주의 | 얕은 비교로 인해 복잡한 객체는 효과 제한 |
