useMemo

React : memo로 재렌더링 막기 (memo, useMemo)

memo 부모컴포넌트가 재렌더링되면 자식컴포넌트도 항상 함께 재렌더링된다. 이 때 자식컴포넌트가 무겁다면 특정 버튼을 클릭할 때마다 모두 재렌더링 되어 로딩시간이 걸리는 등 문제가 생길 것이므로, memo로 자식컴포넌트가 특정 상황에서만 재렌더링되도록 작성해주면 좋다. 쓰기 전 주의사항 memo로 감싼 자식컴포넌트는 기존 props와 현재 props를 검사해 props가 변할 때만 재렌더링한다. 그러므로 props가 매우 길고 복잡하다면 오히려 memo를 쓰는 것이 손해일 수 있다. 전 function 컴포넌트(){}는 물론 당연히 이렇게도 표현이 가능하다. let Child = function(){ return 자식컴포넌트 } 후 memo를 import 해온 후 memo()로 function(){}을 ..