[면접대비] CSR, SSR의 차이점과 장/단점

 

클라이언트 사이드 렌더링(CSR)과 서버 사이드 렌더링(SSR)의 개념에 대해 설명해주시고, 장/단점을 설명해주세요.

 

- CSR은 html과 JS 파일을 모두 주고 클라이언트 측에서 조합하여 랜더링합니다. 처음에는 보이는데 필요한 데이터만 다운받고, 상호작용이 필요한 부분은 나중에 다운받습니다.

- 단점으로는 데이터가 많으면 처음 랜더링하는데까지 걸리는 시간이 오래 걸릴 수 있습니다. 조합하여 랜더링되므로 SEO에 적합하지 않습니다. 장점으로는 빠르게 반응할 수 있어 사용감이 좋습니다. 요청한 데이터를 처리할 때 JS만을 받아와 적용하므로 동적인 작업을 빠르게 할 수 있습니다.

 

- SSR은 서버측에서 이미 완성된 html 상태로 다운받아 랜더링합니다.

- 장점으로는 초기 데이터가 이미 완성되어 있는 html이므로 빠르게 랜더링되며 SEO에 적합한 점이 있습니다. 단점으로는 처음 다운로드 된 파일은 html 파일이므로 JS가 다운로드 되기 전까지는 상호작용을 할 수 없습니다. 또한 화면 깜빡임이 발생할 수 있습니다.