목록최적화 (1)

문미새 개발일지

리액트 성능 최적화 방법

리액트에서 성능 최적화를 위해 적용할 수 있는 방법 컴포넌트 렌더링 최적화React.memo를 사용한 컴포넌트 메모이제이션React.memo는 함수형 컴포넌트를 메모이제이션하여 불필요한 렌더링을 방지한다.사용 예시:const MyComponent = React.memo((props) => { return {props.value};});렌더링 비용이 큰 컴포넌트나, 부모 컴포넌트의 재렌더링이 자식 컴포넌트의 렌더링을 불필요하게 유발할 때 사용된다.useCallback으로 함수 메모이제이션useCallback은 동일한 함수를 재사용하여 자식 컴포넌트가 불필요하게 렌더링되지 않도록 한다.사용 예시:const handleClick = useCallback(() => { console.log('Button c..
개발 TIL 2025. 1. 15. 15:19
이전 Prev 1 Next 다음