[WEB] 웹 렌더링 SSG, SSR, CRS 이란?

SSG (Static-Site Generation)

• 빌드 타임에 js를 변환하여 html을 미리 만들어 둠 > 요청이 들어오면 이미 완성된 html을 반환
• 빠름

단점

• 정적 파일로 제공되기 때문에 현재의 사용자 수준에 상응하는 웹 서비스를 제공하기 어려움.

 

 

SSR(Server-Side Rendering)

• 전통적인 렌더링 방식
• 페이지를 새로고침 > 서버에 요청이 들어오면 html로 바로 만들어서 응답
• SEO에 유리함

단점

• 페이지 이동 시 화면 깜박임
• 새로운 파일을 받아 다시 로드하므로, 클라이언트에서 메모리에 데이터를 유지할 수 없음

 

CSR(Client-Side Rendering)

• SPA
• 처음 웹사이트 진입 시, 비어 있는 html 응답 > 클라이언트 브라우저에서 어플리케이션 렌더링 진행
• 초기 로드 이후, 수준 높은 UX제공

단점

• 초기 요청 시, js파일을 전부 로드해야하기 때문에
• 느린 초기 로드. 어플리케이션의 규모가 커질 수록 구동시간이 느려짐. 
• js파일이 전부 로드되기 전까지 페이지 정보를 구성할 수 없으므로 SEO(Search-Engine-Optimization)에 취약