Client Side Rendering
- 클라이언트인 브라우저가 렌더링을 처리하는 방식
->Web은 단순히 홈페이지라는 개념을 넘어서 응용프로그램의 영역을 대체한지 오래됨. 따라서 사용자의 Interaction을 감지하고 Feedback을 전달하기에 기존의 정적인 웹은 애로사항이 많았음
-> CSR을 도입하면서 페이지가 이동할 때 아름다운 애니메이션을 보여주는 것이 가능해짐
- 장점
- 전 페이지에서 불러왔던 리소스를 다음 페이지로 이동할 때 재호출을 하지 않아도 됨 (트래픽을 아낄 수 있음)
- 단점
- 첫페이지 로딩속도가 SSR에 비해 느림(느린 초기로딩 속도)
-> 서버에 첫 요청 시 전체페이지에 대한 모든 문서 파일들을 받다보니 SSR보다 느림(기존의 HTML, CSS, Javascript는 웹사이트를 구동하기 위한 최소한의 다운로드만 진행하면 됐었음)
-> CSR이 도입되면서 CSR을 구현해줄 라이브러리도 함께 사용하다보니 웹에 접속하는 모든 사람이 React나 Vue와 같은 라이브러리를 같이 다운로드 해야함
- (SEO)검색엔진최적화에 대한 추가 보완작업이 필요함
-> CSR은 말 그대로 홈페이지 접속 이후 Javascript가 DOM을 생성하거나 교체하는 등의 작업을 통해 웹을 구현하는 것을 말함
-> 검색엔진들은 웹을 탐색하면서 읽어낸 HTML을 바탕으로 해당 웹사이트의 요소들을 파악하지만 CSR은 크롤러가 웹을 읽는 타이밍에 HTML을 생성하지 못하므로 페이지 색인에 문제가 생김
-> 결국 이런 문제들을 해결하기 위해 SSR이 도입됨
- CSR은 동적인 웹사이트를 만들 수 있어서 좋음
- But 초기로딩이 느리고 검색엔진에 잘 잡히지 않을 수 있음
developer(Frontend)