React useCallback - 함수 재사용

useCallback을 공부해봅시당!

useCallback - useMemo와 비슷한 hook

• useMemo : 특정 결과값을 재사용할때 사용
• useCallback : 특정 함수를 새로 만들지 않고 재사용할때 사용.

useCallback을 사용해 함수 재사용

출처:https://react.vlpt.us/basic/18-useCallback.html
을 읽고 정리함.

const onCreate = ()=>{
	const user = {
    	
    }
};

const onRemove = id => {
	
};

const onToggle = id =>{

};

위의 함수들은 컴포넌트가 리렌더링 될떄마다 새로 만들어진다.
한번 만든 함수를 재사용하는 것은 중요하다.

const onChange = useCallback(
	e=>{
    	
    }
);

const onCreate = useCallback(()=>{
	
});

const onRemove = useCallback (

);

함수 안에서 사용하는 상태 props가 있다면 꼭, deps 배열안에 포함시켜야한다.

useCallback은 useMemo를 기반으로 만들어짐

const onToggle = useMemo(
	()=> ()=> { /* */},[users]
);

useCallback은 컴포넌트 렌더링 최적화 작업을 해줘야 성능이 최적화됨
-> 어떤 컴포넌트가 렌더링 되는지 확인하기 위해서
-> React DevTools 를 사용한다.
-> 'highlight Updates'