목록Performance (1)

No Story, No Ecstasy

리액트를 다루는 기술 개정판 [컴포넌트 성능 최적화]

11. 컴포넌트 성능 최적화 - useState 기본값에 함수를 넣어주면, 처음 렌더링될 때만 함수가 실행된다. . ex) useState(createBulkTodos()) -> 리렌더링마다 호출, useState(createBulkTodos) -> 최초 렌더링 때만 호출 - 크롬 개발자도구 > Performance 메뉴에서 성능 모니터링 - 느려지는 원인 분석 (렌더링이 발생하는 상황) 1. 자신이 전달받은 props가 변경될 때 2. 자신의 state가 바뀔 때 3. 부모 컴포넌트가 리렌더링될 때 4. forceUpdate 함수가 실행될 때 -> 최대한 리렌더링 횟수를 줄여야 한다. - React.memo를 사용하여 컴포넌트 성능 최적화 . 리렌더링을 방지할 때는 shouldComponentUpdat..
Frontend Series 2021. 4. 22. 01:58
이전 Prev 1 Next 다음