React 18: 리액트 서버 컴포넌트 준비하기

간단 소개

React 18의 주요 기능인 서버 컴포넌트(RSC)의 특징, 이점, 그리고 서버 사이드 렌더링(SSR)과의 관계를 설명합니다.

AI Summary

리액트 서버 컴포넌트(RSC) 소개 및 배경
- RSC는 React 18의 주요 기능 중 하나로, 데이터 페칭 문제를 해결하기 위해 등장.
- 기존 방식의 클라이언트-서버 waterfall 문제를 개선하고 사용자 경험을 향상시키는 것을 목표.
RSC의 특징 및 이점
- 서버에서 렌더링되어 API latency 감소 및 번들 사이즈 감소 효과를 가져옴.
- 서버 리소스에 자유롭게 접근 가능하며, 자동 코드 분할을 통해 성능을 최적화.
- 서버, 클라이언트, 공유 컴포넌트로 역할 분담하여 개발 효율성을 높임.
RSC와 SSR의 관계
- RSC는 SSR의 대체재가 아닌 보완재로, 함께 사용하여 초기 로딩 속도와 인터랙티브한 사용자 경험을 동시에 개선 가능.
- Next.js와 같은 프레임워크에서 RSC를 미리 경험해볼 수 있음.