Server component

서버 컴포넌트는 데이터 가까이에서 렌더한다

서버 컴포넌트는 브라우저 번들에 들어가지 않고 서버에서 데이터를 읽어 직렬화 가능한 UI 결과를 보냅니다.

01

서버 렌더

async 컴포넌트에서 DB나 내부 API를 직접 호출해 렌더링에 필요한 데이터를 준비합니다.

02

번들 절감

브라우저 이벤트가 없는 UI는 클라이언트 JavaScript로 보내지 않아도 됩니다.

03

비밀 보호

토큰, 파일 시스템, 서버 전용 라이브러리는 서버 경계 안에 남길 수 있습니다.

1

fetch

데이터 접근이 서버에서 끝나는지 확인합니다.

2

render

상호작용 없는 UI는 서버 컴포넌트로 유지합니다.

3

serialize

클라이언트로 넘기는 props가 직렬화 가능한지 봅니다.

4

stream

느린 영역은 Suspense와 함께 점진적으로 보낼 수 있습니다.