404 page not found : 기록장

useMemo와 useCallback은 React Hooks API의 일부로 두 가지 모두 성능 최적화에 사용됩니다. useMemo useMemo는 계산에 많은 시간이 걸리는 함수의 결과값을 기억합니다. 그리고 해당 함수가 다시 실행될 때마다 결과값이 계산되는 것을 방지합니다. 예를 들어, 다음과 같은 코드가 있을 때: const myList = [1, 2, 3, 4, 5] const total = useMemo(() => { console.log('Calculating total...') return myList.reduce((acc, curr) => acc + curr, 0) }, [myList]) 위 코드에서 myList 배열이 변경될 때마다 새로운 배열을 생성하고, 이전과 다른 참조값을 가지게 됩..

React는 매우 빠른 렌더링 성능을 자랑하지만, 큰 규모의 애플리케이션에서는 여전히 성능 문제가 발생할 수 있습니다. 이를 해결하기 위해 함수형 컴포넌트를 사용할 수 있지만, 함수형 컴포넌트 역시 최적화 작업이 필요합니다. 다음은 React 함수형 컴포넌트 최적화를 위한 몇 가지 팁입니다. 1. React.memo 사용하기 React.memo는 컴포넌트의 props가 변경되지 않으면 이전 렌더링 결과를 재사용하여 렌더링 성능을 향상시키는 함수입니다. 함수형 컴포넌트에서는 React.memo를 사용하여 props가 변경되지 않는 경우, 불필요한 렌더링을 방지할 수 있습니다. import React from 'react'; const MyComponent = React.memo(({prop1, prop2}..