Fix: Restore unified Topics folder and reorganize specialized category folders

2026-05-02 23:25:02 +09:00
parent b71a0b82d3
commit fdfbc83535
6241 changed files with 147626 additions and 194 deletions
@@ -0,0 +1,42 @@
+---
+id: m1a2n3a4-g5e6-4a7b-8c9d-0e1f2a3b4c5d
+category: Dev
+confidence_score: 0.99
+tags: [react, state-management, zustand, redux, context-api, concurrent-mode, suspense, server-state]
+last_reinforced: 2026-05-01
+github_commit: "wikification-state-concurrent"
+---
+
+# Modern State Management & Concurrent React
+
+## 📌 한 줄 통찰 (The Karpathy Summary)
+> 현대 React 상태 관리는 목적에 따른 파편화(전역/서버/URL)가 핵심이며, Concurrent Features와 Suspense를 통해 비동기 데이터 흐름을 선언적으로 제어하여 사용자 경험의 끊김을 최소화하는 방향으로 진화했다.
+
+## 📖 구조화된 지식 (Synthesized Content)
+
+### 1. 상태 관리의 전문화
+- **서버 상태 (Server State)**: TanStack Query를 통해 캐싱, 동기화, 낙관적 업데이트를 관리하며 보일러플레이트를 획기적으로 줄인다.
+- **애플리케이션 전역 상태**: Zustand를 활용하여 가벼우면서도 세밀한 리렌더링 제어를 수행한다. Redux는 복잡도가 매우 높은 대규모 데이터 흐름에 한해 채택한다.
+- **Context API**: 주로 정적인 설정값이나 테마 전달에 사용하며, 잦은 업데이트가 발생하는 상태에는 성능 이슈로 인해 지양한다.
+
+### 2. Concurrent React 및 선언적 UI
+- **Suspense**: 컴포넌트가 렌더링 준비가 될 때까지 기다리는 동안 대체 UI(Skeleton 등)를 보여주는 선언적 비동기 처리 방식이다.
+- **Concurrent Rendering**: 우선순위 기반 렌더링(Interruptible Rendering)을 통해 메인 스레드 차단을 방지하고 입력 반응성을 보장한다.
+- **Transitions**: `startTransition`을 사용하여 상태 업데이트의 우선순위를 낮춤으로써 긴급한 UI 상호작용(타이핑 등)을 보호한다.
+
+### 3. 마이그레이션 전략
+- **Context to Zustand**: 불필요한 전체 리렌더링을 방지하기 위해 Context에서 Zustand의 Selector 기반 시스템으로 점진적으로 전환한다.
+
+## ⚠️ 모순 및 업데이트 (Contradictions & RL Update)
+- **과도한 상태 분리**: 상태를 너무 잘게 쪼개면 데이터 일관성 유지가 어려워질 수 있다. 도메인 단위의 적절한 응집도가 필요하다.
+- **Suspense Waterfall**: 중첩된 Suspense는 네트워크 워터폴 현상을 유발할 수 있으므로, 데이터 페칭을 상위로 끌어올리거나(Fetch-then-render) 병렬로 처리해야 한다.
+
+## 🔗 지식 연결 (Graph)
+- **Parent**: 10_Wiki/Topics/Development
+- **Related**: TanStack Query, Zustand, Performance & Memory Management
+- **Raw Source**: 00_Raw/State Management Libraries, 00_Raw/Context API to Zustand Migration, 00_Raw/Concurrent Rendering in React 18+, 00_Raw/React Suspense, 00_Raw/Server State
+
+## 💻 GitHub 동기화 자동화 워크플로우
+1. Stage: git add .
+2. Commit: `git commit -m "[P-Reinforce] Wikify Modern State Management and Concurrent React Features"`
+3. Push: `git push origin main`