Mobx 란?

Mobx 란?

Redux와 다른 상태 관리 라이브러리.
객체 지향적인 특징을 지고 있으며 Redux와 달리 번잡한 보일러 플레이트가 필요없다.

Mobx 개념

MobX는 어플리케이션에서 다음 세 가지 개념을 구분합니다.

• 상태(state)
• 동작(action)
• 파생(derivation)

1. Observable / useObserver

Mobx에서 렌더링 대상이 되는 state(상태, 값)를 관찰 대상(observable value) 라고 칭한다.

관찰 대상(observable value)으로 지정한 State는 그 값이 변결될 때 마다 렌더링 된다.

최근의 리액트에서 hooks를 사용함에 따라 Mobx도 hooks를 이용한다.
이전에는 React를 함수형(hooks)으로 사용하고 싶다면 mobx-react-lite 를 이용해야만 했었는데, 현재는 mobx 버전 6.xxx 이상으로 올라감에 따라 mobx-react만 이용해도 사용할 수 있게 되었다.

2. Computed Value (연산된 값)

연산된 값(Computed Value)은, 기존의 상태값과 다른 연산된 값에 기반하여 만들어질 수 있는 값이다.

주로 성능 최적화를 위하여 사용되며, 어떤 값을 연산해야 할 때, 연산에 기반되는 값이 바뀔때마 새로 연산하게 하고, 바뀌지 않았다면 기존의 값을 유지한다.

3. Reactions (반응)

Reactions 는 Computed Value와 비슷하다.
Computed Value의 경우는 특정 값을 연산해야 될 때에만 처리가 되는 반면에, Reactions는, 값이 바뀜에 따라 해야할 일으 정하는 것.

4. Action (액션)

액션은, 상태에 변화를 일으키는것을 말한다.

만약에 Observable State 에 변화를 일으키는 코드를 호출한다면, 이것은 하나의 액션이다.