솔미는 성장중

문제 상황 오히려 컴포넌트를 나눴더니 성능이 떨어진다? 이것은 렌더링이 최적화되어있지 않기 때문이다. props가 변화하는 곳만 렌더링 해주면 되는데 전부 다 렌더링하고 있는 경우 이런 현상이 발생한다. 해결법 React.memo 컴포넌트를 React.memo()로 둘러싸면 컴포넌트를 메모이징한다. props가 바뀌지 않은 컴포넌트는 새롭게 렌더링되지 않고 메모이징 된 내용을 재사용한다. 언제 사용하면 좋을까? - 새로 업데이트를 잘 시키지 않아도 되는 컴포넌트 예시 const List = React.memo(({ posts, testFunction }) => { console.log("List Component"); return ( {posts.map((post) => ( ))} ); }); useCa..