CSR과 SSR 개념 간단정리를 해보았는데 한번 봐주실수 있을까요?

Question

블로그 여러군데 참고하면서 제가 이해한대로 정리해본 내용입니다.혹시 잘못 개념정리한 부분이 있다면 짚어주시면 감사하겠습니다! &#43;추가적으로 Render Tree에 대하여 궁금한점이 있는데 DOM&#43;CSSOM에 JS까지 적용되는것을 Render Tree라고 하나요 ?DOM&#43;CSSOM 까지만을 Render Tree라고 하나요 ?

장독깨기 · Answer

브라우저는 html 요소와 스타일을 입력 받아 화면에 그립니다.이걸 랜더링이라 합니다. html 요소를 구조화 한 것이 DOM 입니다.이 DOM 과 스타일을 자바스크립트로 변경할 수 있고, 변경하면 즉각 화면에 반영이 되겠죠.이게 CSR 입니다. ajax 같은 걸로 서버에서 데이터(json)만 받아와 DOM 을 변경시키는거죠.SSR 은 ajax 가 아니라 href 링크 등으로 html 문서를 서버에 요청합니다.서버는 데이터를 html 문서로 만들어서 제공합니다.그럼 브라우저는 html, 스타일을 해석해서 DOM 을 만들고 화면에 그립니다.

[object Object] · Answer

csrrequset -> html, js, css, etc response -> 브라우저에서 js 실행, 서버로 데이터 request -> responsessrrequest -> 서버에서 데이터를 html로 미리 다 그려 놓음, html, js, css, etc response이런 느낌이 더 맞을거같아요.&#43;상황에 따라서 lazy import라던가 skeleton등을 이용해서 첫화면이 csr이 더 빠르게 보이는 경우도 있구요&#43;csr때 서브페이지의 데이터를 다 받아오는 경우가 많은지 저는 잘 모르겠네요.두 가지 개념이 상황에 따라, 언어 프레임워크에 따라 다른 경우가 좀 있을거같네요.그래서 상황에 맞게 두 가지를 섞어서 하는경우도 많습니다.그리고 render tree는 js 전까지로 알고 있습니다.

CSR과 SSR 개념 간단정리를 해보았는데 한번 봐주실수 있을까요?

2개의 답변

Q&A 목록