핵심 요약
소크라에아이의 글은 App Router와 React Server Components의 Streaming으로 서버에서 데이터를 페칭하고 Suspense로 부분 로딩을 제어해 UX를 개선하는 실전 가이드를 공유합니다.
주요 경험
- 데이터 페칭은 가능하면 BFF에서 수행하고, 필요한 데이터를 프롭으로 전달하는 기본 패턴을 채택합니다.
- Payload를 활용해 Server Component에서 Client Component에 Promise를 프롭으로 전달하고, Suspense 경계로 부분 렌더링을 제어합니다.
얻은 인사이트
- 체감 대기 시간은 로딩 피드백(UI)으로 좌우되므로 Skeleton UI와 로딩 상태의 활용이 중요합니다.
- 서버-클라이언트 경계와 Payload 설계를 통해 지연을 줄이고, Wrapper 중복 없이 데이터 공유를 최적화할 수 있습니다.
