SSR, CSR
SSR, server side rendering
CSR, client side rendering
CSR
- CSR은 리액트로 만든 SPA 웹앱이라고 생각하면 된다
- index.html이 텅텅 비어있고,
- 버튼을 누르면 자바스크립트로 동적으로 화면을 다시 그려서 페이지가 넘어가는 것처럼 보인다
- 처음 리액트를 배울 때 안드로이드 앱 만드는 느낌이 강하게 들었다
- 최초에 index.html를 서버에서 받고, 화면이 넘어가는 경우 필요한 데이터만 서버에 요청한다
(JSON 등 데이터만 주고받음으로 가볍다고 볼 수 있다) - 데이터를 가져오면 이미 가지고 있는 틀에다가 바인딩하여 보여준다
SSR
- 전통?적인 방법이다
- 버튼, 링크를 누르면 서버로 다른 html 파일을 요청한다
- CSR과 반대로 html 내용이 꽉꽉 차있다
- SEO에 유리하다
- 크롤러(bot)는 그냥 html의 내용을 읽으면 된다
- CSR은 페이지 접속 만으로는 콘텐츠가 생성이 되어있지 않기 때문에 크롤러(bot)가 난감할 것이다