CSR과 SSR 개념잡기

www.youtube.com/watch?v=Y2spCNZDt84&ab_channel=FullstackAcademy

 

위의 영상을 보고 다시한번 CSR(Client-side rendering)과 SSR(Server-side rendering)의 차이를 확실히 짚어보려고 한다. 

 

위의 강의에서는 네가지를 다룬다. 

 

1. What is happening during client-side rendering

2.What is happening during server-side rendering

3. A comparison of the two in terms of performance

4. case study

 

Client-side rendering

-> initial request가 있을때 page, layout, css, javascript 를 로드 한다. 

-> some or all 컨텐츠가 포함이 안되어있을수가 있다. 

-> 자바스크립트가 추가적으로 요청해서 Json 데이터와 같은 response를 받고, 적절한 html을 생성한다. 특히 React같은 라이브러리를 사용해서.

-> 뒤따르는 페이지에서 업데이트 처리를 위해 CSR은 초기 컨텐츠를 위의 작업들을 반복한다. 

강의 자료!!

 

Server-side rendering

- SSR에서도 초기 요청에서 page, layout, css, javascript를 가져오는데 특히 html도 같이 가져온다. 

- SSR을 통한 업데이트는 개발자들 머리를 뽀개는데, 왜냐면 개발자들이 이게 화면이 리프레시 된다고 생각하기때문. 근데 사실 리프레쉬가 아니라, 부분적인 업데이트를 하는데, 이걸 서버가 하는것

(In other words, we are still only doing a partial update, but letting the server do the rendering and inserting that finalized output into our DOM)

 

강의 자료!