CSR

Client Side Rendering

• 최초 요청시 HTML을 비롯한 CSS, js 등 리소스를 받아옴
• 이후 서버에는 데이터만 요청하고, 자바스크립트로 뷰를 컨트롤 함
• 처음 렌더링 할때는 SSR이 빠르겠지만 이후 다른 페이지로 이동할 때는 CSR이 빠름

SSR

Server Side Rendering

• 과거부터 현재까지 많은 웹사이트들이 페이지를 이동할 때 서버에 새로운 페이지에 대한 요청을 하는 방식을 택함
• 서버에서 렌더링을 마치고 데이터가 결합된 HTML파일을 내려주는 방식
• 새 페이지로 이동할 때 마다 서버에 요청해야해서 받아오는 시간 동안 깜빡거림 발생

번외 - SPA

Single Page Application

말 그대로 한 개의 페이지를 가진 애플리케이션

기존의 웹은 Client가 서버에 새로운 요청을 보낼 때마다 페이지를 다시 랜더링하는 방식이었다. 하지만 SPA에서는 가장 기본이 되는 큰 페이지를 초기에 랜더링을 하고 그 후부터는 서버와의 Ajax통신을 통해 정보를 주고받고 이를 동적으로 부분부분만 변환하는 방식

특징

• 사용자 친화적
• 초기 렌더링 후 데이터만 받아오기 때문에, 상대적으로 서버 요청이 적음
• Virtual Dom
• 프론트 엔드와 백엔드 분리로 개발업무 분업화 및 협업이 용이
• 개발이 상대적으로 효율적

기본적으로 SPA는 CSR방식이지만
SPA === CSR 는 아님.

---

Reference

• https://velog.io/@ru_bryunak/SPA-%EC%82%AC%EC%9A%A9%EC%97%90%EC%84%9C%EC%9D%98-SSR%EA%B3%BC-CSR