Jotai 상태 관리툴 적용記 - 풋살 기록 웹플리케이션 (5)

Dzeko·2024년 6월 14일
2

개발일지

목록 보기
76/76
post-thumbnail

State management

처음엔 상태관리툴이 필요 없다고 생각했다.
프로덕트 크기가 작다고 생각해 props로만 내려줘도 괜찮다고 생각했다.
하지만 진행하면서 점점 상태 관리가 힘들어졌고, prop drilling이 심해졌다.
이 drilling은 atomic 패턴으로 전환하면서 더욱 심해졌다.
더 힘들어지기 전에 이제는 써야한다.

Why Jotai?

React 상태 관리툴은 다양하고, 각각의 특징이 있다.
어느 라이브러리를 잡아갈지 유형별로 용의선상에 올려놓고 살펴보았다.

Flux 방식 - Reduz, Zustand
Atomic 방식 - Recoil, Jotai

가장 많이 쓰이는 Redux는 배제하고 시작한다.
초기 세팅부터 번거롭고 개인적으로 보일러플레이트 코드 보는 것을 견디지 못한다. 더군다나 무겁다.

Recoil과 Jotai 중에서는 더 가벼운 Jotai에 마음이 기울었다.

이제 Zustand와 Jotai 중에 정하면 되는데, 중앙 집중 관리 형태는 익숙했지만 상태를 Atomic하게 관리 한다는 것이 생소했다.

Jotai의 철학은 이렇다.
각각의 atomic한 상태는 독립적이며, 컴포넌트가 필요한 원자만 구독함으로써, 불필요한 리랜더링을 최소화하며 상태 관리를 간단하게 한다.
atom 단위의 상태는 분리를 쉽게하고 재사용할 수 있게 해준다. 모듈화된 코드를 지향해 개발자에게 강력하고 사용하기 쉬운 상태 관리를 제공한다.

이 철학이 매우 매력적으로 다가왔고, 상태 간의 의존성을 쉽게 관리하기 위한 내 프로젝트에도 적합하다 생각했다.

의도치 않게 디자인 패턴도 atomic 패턴으로 전환하고 있는 참이었는데,,
atomic Component, atomic State.
아름답다.

적용 후기

  1. 사용하기 굉장히 쉽다. 너무 쉽다. 가이드 문서도 너무 잘 돼있다.
  2. 리액트스럽다는 것이 뭔지 알겠다. useState 의 형상을 차용한 컨셉이 너무 마음에 들었다.
    useAtom은 값과 update의 튜플로 전달된다.
  3. 가이드 문서에서, atom 값이 사용되지 않으면 가비지 컬렉션을 통해 정리된다고 한다. 메모리 관리에 신경을 쓴게 느껴졌다.

이런 점들에서 Jotai의 철학이 느껴졌다.
쓰면서 계속 감탄했다. 개발자를 위한 개발이 얼마나 멋지고 뿌듯할지 감히 상상해 본다..

profile
Do or Die

0개의 댓글