React Conf 2025 (Day 1)
(frontoverflow.com)지난 주에 2025년 리액트 컨퍼런스가 있었습니다.
첫째 날에는 주로 리액트와 관련된 주제로 발표가 진행되었습니다.
-
React Keynote
- React 19.1(Owner Stacks), 19.2(Activity/useEffectEvent/Partial Pre-rendering), Canary(View Transitions) 발표
- React Compiler 1.0 정식 출시, 자동 메모이제이션과 코드 분석 제공
- React Foundation 설립으로 커뮤니티 중심 거버넌스 시작
-
View Transitions and Activity
-
<Activity />로 state lift-up 없이 visible/hidden 상태 전환 및 state 자동 보존 -
<ViewTransition />으로 Server Components에서도 선언적 애니메이션 구현 - UI 상태 관리와 애니메이션을 composable하고 declarative하게 처리
-
-
Profiling with React Performance Tracks
- React 19.2부터 Chrome DevTools에서 React 작업 타임라인 시각화 지원
- Scheduler/Components/Server Components Track으로 성능 병목 지점 파악
- Suspense Panel 추가로 Suspense boundary 상태 시각화(2025년 말 출시)
-
In case you missed the memo
- Sanity Studio는 React Compiler로 1,000개 이상 컴포넌트 memoize, 평균 20~30% 성능 향상
- 세밀한 최적화(context 조건부 구독, 브랜치 memoization)와 버그 탐지 가능
- 즉시 도입으로 메모이제이션 걱정 없이 "Make it work"에 집중 권장
-
Async React
- Transitions, Suspense, Server Components는 비동기 앱 구축을 위한 새로운 구조
- Suspense, router, caching으로 loading states 번쩍임 해결
-
startTransition과 애니메이션 통합으로 data fetching-UI updating 조율
-
React and AI
- Meta는 AI를 버그 수정/코드 탐색에 활용, LLM rules로 컨텍스트 주입
- 올바른 context 식별에 집중, AI를 페어 프로그래밍 파트너로 활용
- React의 stable API는 AI 툴 구축 기반, AI Engineer로 커리어 전환 기회
-
Exploring React Performance
- Data Model과 Rendering Algorithm 균형이 중요, React Compiler가 성능 개선
- Domain-specific 접근법이 일반적인 증분 알고리즘보다 우수
- Transitions, Suspense, Virtualization,
<Activity />와 Data Modeling 활용
-
The invisible craft of great UX
- 클릭-드래그-놓기, OS별 팝오버, 툴팁 지연 등 작은 디테일이 UX에 큰 영향
- DOM 이벤트가 아닌 사용자 의도 해석, 스크럽 커서 고정/순간이동으로 문제 해결
- 다중 팝오버를 단일 요소로 재사용하여 성능 향상(300개→1개)
-
Building an MCP Server for a React Component
- MCP는 AI-외부 시스템 연결 오픈 소스 표준, USB-C처럼 표준화된 방식 제공
- AG Grid는 36만 개 문서를 임베딩하여 Postgres 저장, LLM에 정확한 컨텍스트 제공
- Prompts/Resources/Tools로 문서 검색과 빠른 컴포넌트 생성 지원
-
Why React Native apps make all the money
- React Native는 유료 전환율, 설치당 수익, LTV에서 우수한 성과
- 크로스 플랫폼 개발로 빠른 출시와 일관된 수익화 전략 적용
- RevenueCat SDK로 페이월, 분석, 가격 실험 등 간편한 수익화 지원
-
Modern emails using React
- 이메일은 CSS 속성 미지원과 클라이언트별 렌더링 차이로 개발 어려움
- React Email은 컴포넌트 기반 제작, 호환성 테스트, 링크 검사 등 지원
- Render 함수로 HTML 변환, Resend API로 주요 기업 사용 중
-
React team Q&A
- React Compiler는 Rules of React 준수 시 안전 도입, 새 코드는 useMemo/useCallback 불필요
- AI는 페어 프로그래밍 파트너로 활용, 아키텍처 설계 능력 중요
- React Foundation은 5년간 Meta 역할 감소, 커뮤니티 확대와 친절한 분위기 요청