- React 서버 컴포넌트에 대한 의견이 분분하며, Dan Abramov가 Astro를 사용하여 이를 명확히 설명함. 💡
- Astro는 Astro 컴포넌트와 클라이언트 측 JavaScript 컴포넌트(Vue, Svelte, React 등)를 함께 사용할 수 있음. ⚛️
client:load
디렉티브는 페이지 로드 시 React 컴포넌트 실행에 필요한 JavaScript를 로드하고, client:visible
은 뷰포트에 보일 때까지 로드를 지연시킴. 👁️
- React 서버 컴포넌트(RSC)는
use client
디렉티브를 사용하여 클라이언트 측 코드를 명시하며, Astro와 유사한 멘탈 모델을 가짐. 🧠
- Astro는 서버 측과 클라이언트 측의 분리가 명확하지만, RSC는 더 많은 유연성을 제공함. 🤸
- Astro 컴포넌트는 HTML을 생성하는 데 중점을 두지만, React는 가상 DOM diffing을 통해 부분적인 페이지 리로드가 가능함. 🔄
- Astro의 "server defer" 디렉티브는 페이지 로드 후 데이터를 비동기적으로 로드하여 초기 로딩 속도를 개선할 수 있음. ⏳
- Dan Abramov는 Astro를 RSC로의 더 쉬운 진입점으로 추천함. 👍