MobX
MobX - 간단하고 확장 가능한 상태 관리
- functional reactive programming을 투명하게 적용함으로써 상태 관리를 쉽고 확장성 있게 만들어주는 검증된 라이브러리
10분만에 알아보는 MobX와 React
Redux
Redux - 자바스크립트 앱을 위한 예측 가능한 상태 컨테이너
https://velog.io/@ye-ji/Vuex와-Redux가-무엇인가
MobX vs Redux
React에서 Mobx 경험기 (Redux와 비교기) | 우아한형제들 기술 블로그
Redux
- Flux개념을 바탕으로한 React에서 현재 가장 많이 사용되는 State 관리 라이브러리
- 보일러플레이트 코드들의 양이 많고 그런 코드들을 작성하기 위해서는 어느정도 학습이 동반되어야 한다.
MobX
- Redux와 또 다른 State관리 라이브러리
- 기본적으로 객체지향 느낌이 강하며
- Component와 State를 연결하는(Redux와 달리)
번잡한 보일러플레이트 코드들을 데코레이터(애노테이션)제공으로 깔끔하게 해결
- State의 불변성을 유지하기 위해서 번잡스러운 코드나 ImmutableJs같은 라이브러리를 따로 사용할 필요가 없다.
- Redux에 비해서 낮은 러닝 커브와 높은 가독성
MobX와 Redux의 차이 및 Mobx 학습 정리✨
- Redux는 함수형 프로그래밍에 영향을 받은 라이브러리다.
MobX는 OOP를 권장하는 라이브러리로, OOP 익숙한 많은 개발자들이 쉽게 접근하고 사용할 수 있다.
- Redux는 구조상 Store와 Component의 연결을 위해 번잡한 코드들을 계속 작성해주어야한다.
MobX는 이러한 코드를 데코레이터를 사용하여 깔끔하게 작성할 수 있다.
- Redux는 Store의 상태를 Immutable하게 변경하기 때문에 항상 새로운 상태를 반환해야한다(Read Only).
MobX는 Mutable하게 변경이 가능하다(Read and Write).
- 비동기 처리를 위해서 Redux는 별도의 라이브러리를 추가적으로 사용해야 한다(redux-thunk, redux-saga).
MobX는 async action을 지원해서 async/await 문법을 사용해 깔끔하게 처리가 가능하다.