valtio

Valtio는 JavaScript 프록시를 기반으로 만들어진 상태 관리 라이브러리로, React와 순수 바닐라 JavaScript에서 사용할 수 있습니다. 핵심 아이디어는 단순합니다. 상태 객체를 `proxy()`로 감싸면 코드 어디에서든 일반 객체처럼 변경할 수 있는 스스로 인식하는 프록시가 됩니다. README에서 설명하는 주요 기능: - **프록시 상태**: `proxy({ count: 0, text: 'hello' })`는 변경 가능한 상태를 생성하며, `++state.count`와 같은 변경은 일반 객체에서처럼 작동합니다. - **React 통합**: `useSnapshot(state)`은 렌더링을 위한 로컬 스냅샷을 반환합니다. 컴포넌트는 접근한 상태 부분이 변경될 때만 다시 렌더링되며, 프로젝트에서는 이를 렌더링 최적화라고 설명합니다. `sync: true` 옵션은 제어된 입력과 같은 경우를 위해 배칭을 비활성화합니다. - **구독**: `subscribe`는 전체 상태나 하위 객체에 작동하고, `subscribeKey`는 원시 값에 사용합니다. `watch` 유틸리티는 사용 방식에 따라 자동으로 구독합니다. - **Suspense 지원**: 상태에 보관된 비동기 데이터를 읽기 위한 React 19 `use` 훅과 호환되며, 부모가 fallback과 오류를 처리합니다. - **추적되지 않는 객체**: `ref`는 큰 객체나 특수 객체(예: DOM 노드)를 프록시로 감싸지 않고 상태 안에 유지합니다. - **바닐라 사용**: `valtio/vanilla`는 React 외부에서 사용할 수 있도록 `proxy`, `subscribe`, `snapshot`을 내보냅니다. - **유틸리티**: `useProxy`는 초보자를 위한 단순화된 얕은 프록시를 제공하고, `proxySet`과 `proxyMap`은 네이티브 Set과 Map 동작을 모방합니다. 계산된 속성은 객체 getter로 정의할 수 있습니다. - **개발 도구**: 일반 객체와 배열을 위한 Redux DevTools Extension과의 통합을 제공합니다. - **호환성**: Valtio v2는 React 18 이상을 대상으로 하며, `react`에만 의존하고 react-dom, react-native, react-three-fiber와 같은 렌더러는 물론 Node.js와 Next.js에서도 작동합니다. README는 또한 읽기 전용 스냅샷 타입과 관련된 TypeScript 타이핑 주의사항, 메서드에서의 `this` 동작에 대한 주의(화살표 함수 권장), 그리고 액션 구성, 상태 지속, 컨텍스트 사용, 상태 분할/구성을 위한 eslint 플러그인과 커뮤니티 레시피를 언급합니다.