SSR(Server-side rendering) 의 개념과 장단점

서버사이드 랜더링, SSR 

Server-side rendering

 

 

 

 

 

 

 

 

 

	서버사이드 랜더링	클라이언트사이드 랜더링
장점	서버로 부터 완성된 웹 페이지를 전달 받기 때문에 검색엔진에 수집, 노출되는데 유리하다.	접속시, 빈 페이지를 먼저 읽어들이기 때문에, 검색엔진에 컨텐츠가 노출되기 어렵다
단점	서버리소스, 스펙이 중요하다. (서버의 요청-응답 속도 등)	필요하지 않은 나머지 페이지(컴포넌트) 코드까지 한꺼번에 읽어들여야 하기 때문에 경우에 따라 초기 로딩속도에서 SSR보다 불리할 수 있다. *적절한 코드 스플리팅으로 해결 가능

 

 

 

리액트에서 서버사이드 랜더링을 하는 방법

1) 직접 세팅

Webpack 커스텀으로 빌드 경로 등을 커스텀

Node express 으로 페이지 라우터 제작

코드 스플리팅

2) Next.js

독자적 라우팅 시스템으로 손쉽게 서버사이드 랜더링 구축 가능한 라이브러리

Typescript , Redux 등 별도의 라이브러리 및 개발 환경 세팅에 러닝커브가 존재