리액트를 다루는 기술 part8

hwakyungChoi·2020년 8월 24일
0
post-custom-banner

1. 컴포넌트가 리렌더링이 발생하는 경우

  • 자신이 전달받은 props가 변경될 때
  • 자신의 state가 바뀔 /대
  • 부모 컴포넌트가 리렌더링될 때
  • forceUpdate 함수가 실행될 때

2. 컴포넌트의 리렌더링을 방지할때

-shouldComponentUpdate 라이프사이클 사용
-함수형 컴포넌트에서는 React.memo를 사용

  • 함수가 계속 만들어지는 상황을 방지하는 방법
    - useState의 함수형 업데이트 기능 사용
    • useReducer 사용

3. 불변성

  • 기존의 값을 직접 수정하지 않으면서 새로운 값을 만들어 내는 것
  • 불변성이 지켜지지 않으면 객체 내부의 값이 새로워져도 바뀐 것을 감지하지 못함

4. react-virtualized

  • 리스트 컴포넌트에서 스크롤되기 전에 보이지 않는 컴포넌트는 렌더링하지 않고 크기만 차지하게끔

5.immer 라이브러리

  • 구조가 복잡한 객체에도 쉽고 빠르게 불변성 유지 가능하게 함
post-custom-banner

0개의 댓글