간단하게 정의하면 이벤트 핸들러 함수를 재사용하는 것이다.
useMemo와 비슷하지만, Component
들이 props가 바뀌지 않았다면, 아예 리렌더링 시에 기존의 Component
를 재사용하게 만들 수 있는데 이를 위해서는 안의 내용물들이 새로 만들어지지 않아야 한다.
useCallback
은 함수를 재사용하도록 해 새로 만들어지지 않게 해야한다.
import {useCallback} from 'react';
// import 문은 위와 같다
const functionName = useCallback(() => {A}, {B});
useMemo
와 거의 동일한데, B의 값이 변경되지 않은 경우에만 이벤트 핸들러 함수 A를 재사용한다.
useMemo
전에 구했던 값을 다시 구하는데 걸리는 시간을 줄이기 위해 해당 함수에 사용된 변수의 값이 변하지 않았다면 리렌더링시에 재사용
useCallback
전에 렌더링 된 이벤트 핸들러 함수에 사용된 변수의 값이 변하지 않았다면 리렌더링시에 재사용한다. =>Component
재사용 시 필요하다.