React 는 서버 컴포넌트라는 기능이 존재합니다. 서버 컴포넌트의 중요한 이유와,

장단점, 사용방법 등에 정리해 보려고 합니다.

서버 컴포넌트?


React의 서버 컴포넌트가 무엇인지 이해하려면 서버 컴포넌트가 해결하려는 문제가 무엇인지 파악하는

것이 이해를 도울수 있다고 생각합니다.

웹 페이지에서 빠른 응답과 더 많은 인터렉션을 동작하려면 어떤 방식으로 이루어 질까요?

사용자가 어떠한 인터렉션을 할 때마다 서버로 전송하고 새로운 페이지를 로드하는것이 맞을까요?

이 작업들을 클라이언트 환경에서 동작하면 좋지 않을까요?

이를 CSR(Client Side Rendering) or SPA(Single Page Application) 이라고 부릅니다.

하지만 이러한 단일 페이지 어플리케이션은 검색 엔진이 페이지를 읽도록 할수 없고,

사용자의 디바이스 환경이 느리다면 페이지가 로딩되는데 오래걸린다는 단점이 있습니다!

이를 해결하기 위해 SSR(Server Side Rendering), SSG(Static Site Generate) 라는 개념이

등장합니다. Next.js나 Gatsby 와 같은 프레임워크를 이용해 SSR, SSG 를 사용하여 서버에서

페이지를 생성후 HTML 과 자바스크립트를 클라이언트로 전송하게 됩니다.