SSR, CSR / Cookie, Session

Rendering

렌더링 엔진이 요청받은 내용을 브라우저 화면에 표시하는 작업

---

SSR(Server Side Rendering)

보편적인 웹 애플리케이션 렌더링 방식으로 웹페이지에 접근하면 서버에 해당 페이지를 요청하고 서버에서는 HTML과 같은 리소스를 해석하고 렌더링 한다. 요청 시마다 새로고침이 일어나며 서버에 새로운 페이지에 대한 요청을 하는 방식이다.

 

서버에서 view를 렌더링해서 가져오기 때문에 화면 로딩이 빠르다.(JS가 적용되기 전까지는 인터렉션 불가)

view 변경 시 서버에 계속 요청하므로 서버에 부담이 된다.

세션(Session) 사용

---

CSR(Client Side Rendering)

최초 요청에 대해서만 서버가 전체 페이지를 로딩하여 보여주고 이후에는 요청이 있을 때마다 클라이언트의 스크립트를 이용해 렌더링 한다.

 

브라우저에서 HTML, JS 등을 로드한 후 렌더링을 하므로 로딩 속도가 느리다.

최초 로딩 이후 다시 서버에 요청할 필요가 없어 서버에 부담이 덜 된다. 

SEO(Search Engine Optimizition, 검색 엔진 최적화) 문제 : 봇이나 크롤러는 렌더링 된 페이지만 콘텐츠를 수집하는데 CSR의 경우 빈 페이지로 인식할 수 있다.  

쿠키(Cookie) 사용

---

SPA(single-page application)

서버로부터 완전한 새로운 페이지를 불러오지 않고 현재의 페이지를 동적으로 다시 작성함으로써 사용자와 소통하는 웹 애플리케이션이나 웹사이트

---

쿠키(Cookie)

쿠키는 클라이언트(브라우저) 로컬에 저장되는 키와 값이 들어있는 작은 데이터 파일

사용자 인증이 유효한 시간을 명시할 수 있으며, 유효 시간이 정해지면 브라우저가 종료되어도 인증이 유지된다.

---

세션(Session)

세션은 쿠키를 기반하고 있지만, 사용자 정보 파일을 브라우저에 저장하는 쿠키와 달리 세션은 서버 측에서 관리한다.

서버에서는 클라이언트를 구분하기 위해 세션 ID를 부여하며 웹 브라우저를 종료할 때까지 인증 상태를 유지한다.

사용자에 대한 정보를 서버에 두기 때문에 쿠키보다 보안에 좋지만, 사용자가 많아질수록 서버 메모리를 많이 차지하게 된다.

메모리 문제를 해결하기 위해 토큰 기반 인증방식을 사용할 수 있다.(JWT, bearer...)