- Addy Osmani 은 구글 크롬팀 소속이며 TodoMVC, HNPWA 의 프로젝트 프로모션을 진행할 정도로 Framework, 라이브러리에 대해서 잘 다룸
- RSC?
- 컴포넌트 트리 구성의 필수 요소로 데이터 가져오기를 통합하여 최상위 대기 및 서버 측 데이터 직렬화를 가능
- RCS 는 서버에서 실행 되는 Stateless React Component, 서버와 클라이언트 컴포넌트 사이에서 유지보수 가능한 코드들을 재사용을 쉽게 할 수 있는 경험( (
knitting
) 제공
- MPA 유사한 아키텍처 위에서 SPA 와 유사한 라우팅을 가능
- 실제 구현(제공) 은 프레임워크 별로 다를 것
- React 팀은 널리 보급되어 생태계에 영향을 줄 것으로 판단. React 팀의 Dan 은 Server Component 는 앱 데이터 흐름의 뼈대를 이루며 Client Component 는 그 뼈를 둘러싸는 고기 같은 것이라고 비유
- Next.js App Router 와 Server Component 는 어떻게 연동되어 있을까?
- Next.js 13+ 이후에 RSC 지원
-
app
경로 안에 Component 들은 RSC 가 자동 지원
- RSC 는 서버 사이드 인프라와 디펜던시 활용에 장점을 이용하여 나은 성능과 더 작은 번들 사이즈 지원
- Next.js App Router 는 서버-렌더링과 클라이언트-렌더링 혼용하여 점진적으로 앱을 향상해 사용자의 경험을 자연스럽게 만듦. Client Component 명시해서 사용 가능하고 (
use client
) 동일한 컴포넌트 트리에 교차로 배치 가능
- Next.js App Router 를 사용한 좋은 경험들이 나오고 있음
- 그 외에 관련된 다양한 주제들이 있으니 읽어보세요.