[사전 미션 - CSR을 SSR로 재구성하기] - 시모(심호림) 미션 제출합니다.

[simorimi]

🤔 생각해 보기

1. CSR과 SSR에서 초기 페이지 로딩 시간에 어떤 차이가 있었을까? 그 이유는?

csr의 경우보다 ssr의 초기 로딩 속도가 훨씬 빨랐습니다. 아래 동영상에서 확인할 수 있듯 3G 여건일 때 시간 차이가 많이 나는 것을 볼 수 있습니다. 데이터가 느린 요금제를 쓰거나 데이터 여건이 좋지 못한 상황인 경우에는 CSR의 로딩 속도가 거의 1분에 달하기에 사용자 입장에서 불편함을 느껴 해당 어플을 사용하지 않을 수도 있겠다는 생각이 들었습니다.

default.mov

SSR이 더 빠르게 느껴진 이유로는 로딩하는 용량이 적기때문이라고 생각합니다. CSR의 경우 초기 모든 자바스크립트 코드를 받아오기에 SSR에 비해서 초기 로딩 속도가 오래 걸립니다. 반면 SSR의 경우 해당 페이지에서 필요한 HTML만 서버에서 받아오기에 상대적으로 시간이 덜 걸립니다.

• 💡 답변 요령
  • [�x] 사용자 관점에서 CSR과 SSR에서 각각 어떻게 페이지를 로딩하는지와 느끼는 초기 로딩 속도에 어떤 차이가 있었는지 생각해 보자.
  • SSR이 왜 더 빠르게 느껴지는지 이유를 설명해 보자.

2. 서버 측에서 데이터를 가져오는 방식과 클라이언트 측에서 데이터를 가져오는 방식을 비교해서 설명한다면?

CSR의 경우 서버 측에 데이터를 받아온 다음 자바스크립트 코드를 통해 HTML을 만들어 반영하는 과정을 가집니다. 반면 SSR의 경우 서버 측에서 데이터를 받아와서 필요한 부분에 HTML 코드를 변경하고 해당 HTML을 내려다 줍니다.

• 💡 답변 요령
  • 서버와 클라이언트가 각각 데이터를 처리하는 방식의 전반적인 흐름을 설명해 보자.
  • SSR의 경우, index.html을 기반으로 동적으로 콘텐츠를 렌더링하는 과정을 설명하며 CSR 렌더링 과정과 비교할 수 있다.
  • 코드 레벨이 아니라, 두 방식이 어떻게 데이터를 처리하고 화면에 반영하는지를 개괄적으로 그려 보거나 글로 설명해 보자.