렌더링
위에서도 짧게 렌더링을 언급했지만 다시 설명하자면, 서버에 요청해서 받은 내용을 브라우저 화면에 나타내주는 것이다.
서버 사이드 렌더링(SSR)은 페이지를 이동할 때마다 새로운 페이지를 요청해 서버에서 모든 템플릿이 연산을 만치고 렌더링한다.
반면에 다른 렌더링 방식 중 하나인 클라이언트 사이드 렌더링(CSR)은 요청한 한 페이지만 불러오고 사용자가 요청할 때 필요한 부분만 리로딩 없이 클라이언트로부터 받아와 렌더링을 한다.
장단점
SSR
- 처음 렌더링된 html을 클라이언트에 전달해줘 1. 초기 로딩 속도가 빠르다
- 그러나 사용자 요청에 의해 view가 변경될 때마다 서버 연산이 필요해 2. 서버에 부하가 발생하며, 페이지 이동시 화면이 깜빡거리는 3. UX 측면에서의 불편함이 존재한다
- 그러나 렌더링 작업이 완료되기 전 html에 대한 정보가 포함되어있어 4. 페이지 데이터를 수집할 수 있는 장점이 있다
++ 서버 부하 발생, UX측면에서의 불편함이 있음에도 SSR을 이용하는 이유는 검색엔진 최적화가 가능하기 때문이다.
검색엔진은 html 파일에서 데이터를 크롤링하는데 SSR은 서버측 연산관정에서 html에 이미 콘텐츠(데이터)가 포함된 상태로 렌더링 해주기 때문에 검색엔진에서 크롤링이 가능하게 된다.
CSR
- 처음 모든 JS파일을 받아와 1. 초기 로딩 속도가 느리다
- 그러나 데이터 요청이 있을 때만 서버에 요청하기에 2. 리로딩 없이 페이지 전환이 가능하며, 그에 따라 3. 서버에 부담이 적게 간다
- SSR과 반대로 html 파일이 비어 있어 검색엔진에서 4. 데이터 수집을 할 수 없게 된다
