상호작용 밀도 기반의 Astro Islands와 RSC 아키텍처 선택 전략

Context

브라우저 전송 JavaScript 최소화를 통해 초기 로딩 속도를 개선하려는 요구 증가. 기존 SPA 방식의 무거운 Runtime 오버헤드와 Hydration 비용으로 인한 성능 저하 문제를 해결해야 하는 상황.

Technical Solution

• Static-First 구조의 Astro Islands를 통한 정적 HTML 중심 설계 및 필요한 부분만 JS를 로드하는 Partial Hydration 구현
• client:idle 등 세밀한 Directive 설정을 통해 사용자 네트워크 상태에 최적화된 Lazy Loading 제어
• RSC의 Server-Client 간 Unified Tree 구조를 활용한 Server Action 도입 및 API Boilerplate 제거
• 상호작용 밀도가 높은 대시보드 환경에서 Server State의 직접 전송을 통한 데이터 동기화 효율화
• 배포 환경의 제약 사항에 따라 Static Export가 가능한 Astro와 Streaming 서버가 필요한 RSC 간의 인프라 정합성 고려