Client Side Rendering / Server Side Rendering
CSR / SSR 두가지 방식을 결국 렌더링(Rendering) 방식에 차이가 있는 것이다.
SPA (single page application)이란 사용자가 한 페이지내에서 머물르면서 필요한 정보 만 받아와 보여주는 것을 말한다. 필요한 정보만 받아와 보여줌으로 효율성이 증대된다.
이 부분에서 SPA는 CSR의 방식을 이용하고 말할 수 있다.
HTML 및 static 파일들이 로드 되면서 데이터가 있다면 데이터가 사용자의 화면에 나타나게 된다. 단어에서도 알 수 있듯 사용자가 중심이 되는 것이다.
요즘 많이 사용하는 react로 프로젝트를 진행하다 보면 index.html 파일이 있는데 이 파일에는 별 다른 내용이 없다.
정말 <div class="root" ></div> 와 js파일을 연결해 주는 코드만 존재하는 경우가 대부분이다. 이 처럼 CSR의 방식으로는 사용자가 요청시에 자바스크립트 파일을 불러오게 되고 이를 출력하여 화면에 표시하게 된다.
하지만 구성하고 있는 js파일이 많아지게 되고 무거워지게 된다면 처음 페이지를 로딩하는데 많은 시간이 소요되는것이 단점이다.
또 다른 단점은 SEO의 문제이다.
SEO란, Search Engine Optimaization 의 약어로서 우리가 흔히 사용하는 검색 엔진, 구글 네이버와의 조합니다. 사용자가 검색을 했을때 이런 검색 엔진들은 여기저기에 흩어져 있는 정보를 불러와 내역을 보여주게 되는데 실질적으로 index.html 안에 있는 내용이 없기 때문에 검색결과에 잘 반영되지 못한다는 단점이 있다.