SSR
Server Side Rendering
장점
- Initial Load가 빠름
- 정적인 사이트에 적합함
- JS에 dependency가 없음
- SEO를 위한 크롤링이 쉬움
단점
- 모든 페이지가 리로드 됨 (서버 로드를 증가시키고 불필요한 컴퓨팅)
CSR
Client Side Rendering
장점
- 앱과 같은 경험을 제공하기에 좋음
- JS 라이브러리에 최적화
- 처음 로드된 후 다른 페이지로의 로드 시간이 짧음
단점
- Initial load가 느림
- SEO 문제
- API 응답 지연
SEO
- SEO를 위한 최적화는 필수임 웹페이지는 검색 엔진에 적합한 메타 데이터를 반영해야 함 (Google과 같은 검색 엔진은 자동화 된 봇을 통해 메타 데이터를 크롤링)
- CSR을 사용할 때 콘텐츠는 JS를 통해 생성함 이는 한 페이지에서 다른 페이지로 메타 데이터를 변경할 때 JS에 의존하고 있다는 걸 의미함 플러그인이나 라이브러리 모듈을 사용하여 각 페이지에 대한 메타 데이터를 설정하여 클라이언트 측에서 렌더링 되도록 해야 함
- SSR을 사용하면 전체 페이지가 메타 데이터로 컴파일 됨 최종 HTML 컨텐츠를 수신하면 프론트 엔드로 전송됨 이 방법은 검색 엔진 크롤러가 JS 사용을 허용하는지 여부에 관계없이 페이지 메타 데이터가 정확한 상태를 유지하도록 함
- 즉 SSR이 더 SEO-friendly 함
- 그러나 구글 봇이 JS도 지원하기 때문에 CSR도 괜찮다고 하지만 잘 모르겠음