CSR(Client Side Rendering)
동작 방식
1. User Request Website
2. CDN이 HHML 파일과 JS를 연결한다
3. Browser는 HTML과 JS를 download 받는다
4. Browser Javascripts downloads
5. JS executed APIs data User can sees placeholders
6. Server Response with API data
7. API data interactive page
SSR(Server Side Rendering)
동작 방식
1. User Request Website
2. Server Ready to Render HTML files
3. Browser quickly render HTML site isn't interactive
4. Browswer downloads Javascript
5. user can view content and interactions can be recorded
6. Browser executes JS Framework
7. recordewd interactions execute and page is now interactive
CSR vs SSR
1. 웹페이지 로딩 시간
CSR은 모든 문서 파일을 받아 처음 로딩 속도가 느리지만 새로고침이 발생하지 않아 서버 트래픽을 감소 시키는 효과가 있고
SSR은 첫 페이지 로딩 속도가 CSR보다 랜더링이 빠르고 검색엔진최적화(SEO)가 가능하지만 초기 로딩 이후에 페이지 이동 속도가 다소 느리다
CDN(Content Delivery Network): 콘텐츠 전송 네트워크로 데이터 사용량이 많은 애플리케이션의 웹 페이지 로드 속도를 높이는 상호 연결된 네트워크로 CDN은 사용자가 웹에 접근할 때 해당 사이트와 거리가 멀 경우 웹 이미지 및 파일을 로드하는데 오랜 시간이 걸리기 때문에 지리적으로 가까운 CDN 서버에 저장하여 사용한다.(저장방식 Points of Presence로 지역별로 자체 캐싱 서버를 가지고 사용자에게 콘텐츠를 제공한다)
'상상력 사전' 카테고리의 다른 글
| 반도체 용어 정리 (0) | 2023.06.15 |
|---|---|
| Axios vs Fetch 비교 (0) | 2023.05.30 |
| REST API (0) | 2023.05.30 |
| Arrow function (0) | 2023.05.22 |
| VSCode github Commit 방법 (0) | 2023.04.25 |


