IT/React & Next.js

[React] 상태 관리 라이브러리 비교

땅일단 2024. 9. 29. 02:45

1. Redux

- 가장 보편적

- 다소 많은 보일러플레이트 (store, reducer, action ...)

- Action을 통해 상태 변화를 감지함

- 보통 공식 라이브러리인 Redux-Toolkit과 함께 사용하여 코드가 조금 간소화됨

- 캐시 기능은 RTK Query로 구현 가능

- 비동기 처리를 위해 Redux-Thunk나 Redux-Saga 등의 미들웨어 사용

 

2. Recoil

- 상태의 단위인 Atom을 사용, 유일한 키값으로 구분함

- react hook을 통해 상태 변화를 감지함

- Atom이 변경되면 해당 Atom을 구독하고 있는 컴포넌트들만 리렌더링됨

- 상태 변화는 Selector를 통해 이루어짐

- Selector는 자동 캐싱, 비동기 처리

 

3. Jotai

- Recoil에서 영감을 받음

- Atom이라는 작은 단위로 나눔

- 보일러플레이트가 굉장히 단순하여 쓰기 쉬움

- 자동 캐싱

 

4. Justand

- react hook을 통해 상태 변화를 감지함

 

5. MobX

- 양방향 데이터 바인딩 패턴 사용

- 객체 지향적

- Observable State로 상태 변화를 감지함

- 비동기 처리를 위해 MobX-React 등의 미들웨어 사용

- Redux와 달리 store가 여러 개가 될 수 있어 분리에 편하지만 유지보수가 힘들 수 있음