CSR과 SSR의 차이

[펌] CSR과 SSR의 차이

요약 :

렌더링이란 웹 페이지 접속 시 그 페이지를 화면에 그려주는 것
SSR(Server Side Rendering)이란 요청시마다 새로고침이 일어나며 서버에 새로운 페이지를 요청하는 방식
서버는 단지 JSON만 보내주며, html을 그리는 역할을 클라이언트측의 자바스크립트가 수행하는 것이 CSR(Client Side Rendering)
SPA(Single Page Application)은 최초 한 번 페이지 전체를 로딩하여 바뀐 데이터만 변경하여 사용하는 웹 어플리케이션으로 요청시마다 서버로부터 리소스를 받아 해석하고 화면에 렌더링하여 SSR에 비해 성능이 뛰어나다.
SSR은 View를 서버에서 렌더링하여 가져오기에 첫 로딩이 짧다.
CSR은 HTML, JS 번들, 각종 리소스를 다운받은 후 브라우저에서 렌더링하기 때문에 초기 로딩 속도가 길다.
초기 로딩 이후에는 사용자의 행동에 따라 필요한 부분만 바꾸기 때문에 서버에서 렌더링하여 전체 페이지를 읽어들이는 SSR에 비해 빠른 인터렉션이 가능하다.
CSR은 자바스크립트를 실행해 View를 렌더링하기 때문에 웹 크롤러 봇들이 CSR 페이지를 빈 페이지로 인식하여 SEO(검색엔진최적화)의 문제가 존재한다.
SSR은 서버측의 세션에 사용자에 대한 정보를 관리하였으나 CSR은 쿠키에 관리하기 때문에 보안 문제가 있다.