✨메모이제이션(memoization) : 동일한 입력이 들어오면 재활용하는 프로그래밍 기법
- useCallback: 메모이제이션된 함수를 반환하는 함수, 이전에 생성된 함수를 기억하고 해당 함수 재사용
- 함수와는 상관없는 상태 값이 변할 때 함수 컴포넌트에서 불필요하게 함수를 업데이트하는 것을 방지
REACT - Hook(2)_useMemo, 활용(소수 판별)
useMemo : 컴포넌트의 성능을 최적화하는데 사용되는 훅 memoization을 뜻함 -> 메모리에 넣기! 컴퓨터 프로그램이 동일한 계산을 반복해야 할 때 이전에 계산한 값을 메모리에 저장함으로써 동일한
ohyohyo.tistory.com
- useMemo , useCallback 차이
useMemo | useCallback | |
재사용 | 계산 비용이 큰 연산의 결과를 재사용 | 함수를 재사용 |
반환 | 연산 결과 | 함수 |
메모이제이션 | 값 | 함수 |
콜백함수 | 값을 계산하는 로직 | 함수를 생성하는 로직 |
사용 | 배열이나 객체와 같은 큰 데이터를 가공하거나 복잡한 계산을 수행하는 경우 | 자식 컴포넌트에 전달되는 콜백 함수를 최적화하는 경우 |
'JavaScript > React' 카테고리의 다른 글
React - 할 일 폼 만들기(5)_ 2차원배열, 번호 증가, 매개변수 변경, 목록 UI변경 (0) | 2024.03.30 |
---|---|
React- setState (0) | 2024.03.30 |
React - 소수판별기 구현 (1) | 2024.03.29 |
React - Hook(2)_useMemo, 활용(소수 판별) (0) | 2024.03.29 |
React - 할 일 폼 만들기(4)_수정 (0) | 2024.03.28 |