상태 관리

✍ 복습 자료

• 데이터 무결성

  데이터의 정확성을 보장하기 위해 데이터의 변경이나 수정 시 제한을 두어 안정성을 저해하는 요소를 막고 데이터 상태들을 항상 옳게 유지하는 것

  데이터 무결성을 위해, 동일한 데이터는 항상 같은 곳에서 데이터를 가지고 오자. Single source of truth(신뢰할 수 있는 단일 출처) 원칙은 프론트엔드 뿐만 아니라 다양한 곳에서 언급되는 원칙이다.
  

• 전역 상태 관리

  다크 모드 기능 : 모든 페이지, 모든 컴포넌트에 다크 모드 혹은 라이트 모드가 적용이 되어야 하기 때문에 이러한 테마 설정을 전역으로 관리할 수 있다.

  국제화(Globalization) : 모든 컴포넌트에서 사용자 언어로 표현이 되어야 하기 때문에 전역에서 상태 관리가 필요하다.
  
  
  

• 상태 관리를 위한 각종 툴

  React Context
  Redux
  MobX

  • 상태 관리 툴을 사용하면?
    전역 상태를 위한 저장소를 제공해준다.
    props drilling 문제를 해결할 수 있다.

  • 상태 관리 툴이 반드시 필요한 것은 아니다!
    
    
    

• Props Drilling

  상위 컴포넌트의 state를 props를 통해 전달하고자 하는 컴포넌트로 전달하기 위해 그 사이는 props를 전달하는 용도로만 쓰이는 컴포넌트들을 거치면서 데이터를 전달하는 현상

  • 규모가 커지고 구조가 복잡해지면서 Props의 전달 과정이 늘어난다면?

  1. 코드의 가독성이 매우 나빠진다.
  2. 코드의 유지보수가 힘들다.
  3. state 변경 시 Props 전달 과정에서 불필요하게 관여된 컴포넌트들 또한 리렌더링이 발생한다.
     => 웹성능에 악영향을 줄 수 있다.