Per ardua ad astra.

useCallback 훅들어가며리액트(React.js)에서 사용되는 @useCallback@ 훅에 대해 정리해본다. useCallback 훅개념컴포넌트의 성능 최적화(Optimization)를 위해 자주 사용되는 훅함수를 메모이제이션(Memoization)하여 컴포넌트가 리렌더링될 때마다 함수가 재생성되는 것을 방지한다. 사용 방법@useCallback(() => {}, [])@와 같이 사용한다.첫 번째 인자로 함수를 받고, 두 번째 인자로 의존성 배열(Dependencies Array)을 받는다.const memoizedCallback = useCallback(() => { doSomething(a, b);}, [a, b]); ⇒ 리액트는 컴포넌트가 리렌더링될 때마다 해당 함수를 다시 생성하지 않고,..

useEffect와 useCallback들어가며리액트에서 사용되는 @useCallback@과 @useEffect@에 대해 알아보자. @useCallback@리액트에서 함수를 메모이제이션(Memoization)하는 데 사용된다.불필요한 함수의 재생성을 방지하고, 함수가 의존하는 값이 변경될 때만 새로운 함수를 생성하도록 할 수 있다. 예제 코드아래의 코드에서 @handleClick@ 함수는 @count@ 변수가 변경될 때만 재생성 된다.그렇지 않을 경우 @handleClick@ 함수는 재생성되지 않으며, 같은 함수를 계속 사용하게 된다.이렇게 할 경우 함수의 재생성을 최소화하여 성능 최적화를 하는데 도움을 줄 수 있다.import React, { useCallback, useState } from 'rea..