브라우저의 렌더링 과정과 CSR,SSR 방식에 대해서 궁금한 점이 있습니다,, 살려주세요,,

Question

안녕하세요. 신입 프론트엔드 개발자로 취직하기 위해 이론들을 공부하고 있습니다. 공부하다 브라우저의 렌더링 과정과 CSR, SSR 사이에서 정말 너무 헷갈리는 게 있는데 아시는 분은 부탁드리겠습니다..ㅜㅜSSR이 서버사이드에서 HTML을 렌더링 한다면, DOM CSSOM Tree 구축 Render Tree구축 Layout, Paint등의 '브라우저 렌더링' 과정없이 어떻게 사용자의 화면에 시각화를 해주는 건지 너무나 궁금합니다.만약 이 과정이 서버에서 일어나지 않는다고 한다면 대체 서버에서 미리 만들어서 보내주는 HTML은 어떤 것으로 구성되어 있는지,또 CSR과 SSR 방식에서 모두 브라우저 렌더링 과정이 일어난다면 어느 시점에서 일어나고 차이점은 무엇인지 정말 정말 궁금합니다.다른 사이트에 검색하니 그냥 복사 붙여넣기 마냥 주구장창 다 똑같은 말만 하고 있어서 구글링으로는 해당 질문에 대해 얻을 수 있는 정보가 없네요,, ㅜㅜ 살려주세요 선배님들..!

kiroki · Answer

브라우저는 HTML로 렌더링 됩니다. 이 HTML에는 데이터가 들어가서 동적으로 보여주는 내용이 달라집니다.이 동적으로 달라지는 부분을 어떻게 렌더링하느냐가 CSR과 SSR의 차이점의 핵심입니다. CSR 브라우저에서 HTML 요청 서버(정적 웹서버)에서 HTML 응답 브라우저에서 HTML 렌더링 브라우저에서 데이터를 api 호출등을 통해 불러옴 가져온 데이터로 HTML 내용을 변화 SSR 브라우저에서 HTML 요청 서버에서 데이터를 조회하여 HTML을 동적으로 생성하여 응답 브라우저에서 HTML 렌더링

siva6 · Answer

간단히 구분하자면,브라우져에서 js가 동작하지 않아도 화면의 데이터가 모두 출력된다면 SSR로 보셔도 될 것 같습니다.

브라우저의 렌더링 과정과 CSR,SSR 방식에 대해서 궁금한 점이 있습니다,, 살려주세요,,

2개의 답변

#ssr 목록