Antigravity Agent
18 lines
3.4 KiB
Markdown
18 lines
3.4 KiB
Markdown
# [[React 19|React 19]]
|
|
|
|
## 📌 Brief Summary
|
|
React 19는 UI의 반응성을 높이고 성능 최적화를 자동화하는 데 중점을 둔 React의 주요 업데이트 버전입니다 [1, 2]. 이 버전은 빌드 타임에 자동으로 메모이제이션을 수행하는 [[React Compiler|React Compiler]]를 도입하여 개발자의 수동 최적화 부담을 크게 줄여줍니다 [3, 4]. 또한, 모든 컴포넌트를 기본적으로 서버 컴포넌트([[Server Components|Server Components]])로 처리하여 클라이언트 측 자바스크립트 번들 크기를 획기적으로 줄이고 렌더링 효율을 높이는 패러다임의 전환을 가져왔습니다 [5, 6].
|
|
|
|
## 📖 Core Content
|
|
- **React Compiler (자동 메모이제이션):** React 19 이상 환경에서 작동하는 React Compiler는 코드의 추상 구문 트리(AST)를 분석하여 데이터 흐름을 추적하고, 반응형 값과 정적 값을 스스로 구분합니다 [3, 4]. 결과적으로 `useMemo`, `useCallback`, `React.memo`와 같은 수동 메모이제이션 래퍼 없이도 자동으로 최적화 경계를 삽입해 불필요한 리렌더링 연쇄를 방지합니다 [3, 7, 8].
|
|
- **동시성 렌더링([[Concurrent Rendering|Concurrent Rendering]]) 강화:** `useTransition`과 `[[useDeferredValue|useDeferredValue]]` 같은 훅을 제공하여, 긴급한 UI 업데이트(사용자 입력 등)와 비긴급 업데이트(대용량 리스트 필터링 등)의 우선순위를 분리합니다 [2]. 이를 통해 무거운 연산이 메인 스레드를 블로킹하는 것을 방지하고 애플리케이션의 반응성(INP 등)을 최적의 상태로 유지합니다 [1, 9].
|
|
- **서버 컴포넌트(RSC)의 기본화:** React 19에서는 모든 컴포넌트가 기본적으로 서버 컴포넌트로 동작합니다 [5]. 상호작용이 필요하여 브라우저에서 실행되어야 하는 경우에만 최상단에 `"use client"` 지시어를 명시해 클라이언트 컴포넌트로 선언합니다 [5]. 서버 컴포넌트는 클라이언트로 전송되는 JS 번들 크기를 없애고, 하이드레이션([[Hydration|Hydration]]) 단계를 생략하게 해 초기 로딩 속도와 성능을 대폭 향상시킵니다 [10-13].
|
|
- **데이터 패칭 및 상태 관리의 진화:** 서버 컴포넌트는 브라우저를 거치지 않고 서버 환경에서 직접 데이터베이스나 파일 시스템에 접근하여 데이터를 가져올 수 있습니다 [14]. 또한 `useOptimistic`, `useAction[[State|State]]`, 프로미스를 직접 다루는 `use` 훅 등을 통해 데이터 패칭 및 비동기 상태 관리를 한층 더 효율적으로 수행할 수 있도록 지원합니다 [15].
|
|
|
|
## 🔗 Knowledge Connections
|
|
- **Related Topics:** [[React Compiler|React Compiler]], React Server Components (RSC), Concurrent Rendering, [[useTransition|useTransition]], [[useDeferredValue|useDeferredValue]]
|
|
- **Projects/Contexts:** [[Frontend|Frontend]] Performance Optimization, [[Next.js App Router|Next.js App Router]]
|
|
- **Contradictions/Notes:** React 19의 React Compiler가 수동 메모이제이션 작업의 90% 이상을 자동으로 처리하지만, 타사 라이브러리와의 통합이나 명시적 제어가 필요한 이펙트 의존성 관리를 위해서는 여전히 `useMemo`나 `useCallback`을 수동으로 사용하는 예외 수단(Escape Hatch)이 필요할 수 있습니다 [16-18].
|
|
|
|
---
|
|
*Last updated: 2026-04-25* |