리액트 성능최적화 (1) 썸네일형 리스트형 리액트 성능 최적화 : React.memo TLDR : React.memo는 불필요한 리렌더링을 막는다. 메모 컴포넌트에 Primitive Value만 props로 넘기도록 설계하자. 더 중요한 것은 리렌더링보다 느린 리렌더링을 막는 것이다. 느린 리렌더링은 useMemo를 통해 회적화한다. React 앱의 라이프사이클은 다음과 같다. → render → reconciliation → commit ↖ ↙ state change render phase : React.createElement로 리액트 엘리먼트를 생성 recolcilation phase : 이전 엘리먼트와 새로운 엘리먼트를 비교함 commit phase : 변경된 부분만 dom에 반영 리액트는 매우 빠르지만, 때때로 업데이트에 대한 힌트를 제공해야 한다. 리액트 컴포넌트는 다음 이유 .. 이전 1 다음