Recoil


recoil

  • 업데이트와 구독이 가능하다.

    atom이 업데이트 되면, 해당 atom을 구독하고 있던 모든 컴포넌트들의 state가 새로운 값으로 리렌더링 된다.동일한 atom을 여러 컴포넌트에서 구독할 수 있다.atom은 key라고 하는 고유한 id로 구분된다.

  • 동일한 atom을 여러 컴포넌트에서 구독할 수 있다.

    동일한 atom을 여러 컴포넌트에서 구독하고 있다면 해당 컴포넌트들은 같은 state를 공유하고 있는 것이며, 상태가 업데이트 되면 해당 atom을 구독 중인 모든 컴포넌트들이 리렌더링된다.



hooks

useRecoilState() : atom을 읽고 쓰려고 할 때

useRecoilValue() : atom을 읽기만 할 때

useSetRecoilState() : atom에 쓰려고만 할 때

useResetRecoilState() : atom을 초깃값으로 초기화할 때



Redux 🆚 Recoil

상태 저장 상태 변경 장점 단점 사용
Redux 중앙 스토어 액션을 통해 디스패치 중앙 집중화된 상태 관리로 상태 예측 가능, 높은 미들웨어 활용성, 신뢰성 있는 라이브러리, 디버깅 용이성 보일러 플레이트 코드를 많이 작성해야 하는 번거로움 대규모 앱, 복잡한 상태 관리, 비동기 작업 또는 로깅 같은 고급 상태 관리 기능 구현
Recoil atom(컴포넌트가 구독할 수 있는 state 단위) hooks를 사용하여 직접 처리 직관적이면서 간단한 구조, 상대적으로 가벼우며 더 작은 번들 크기, 리액트 사용 최적화 대규모 애플리케이션에서 관리 어려움, 미들웨어 지원 제한적 작은 규모의 앱, 빠른 개발, 작은 번들 크기, 관찰 가능한 상태