SPA, MPA
SPA (Single Page Application)
React.js, Vue.js ...
MPA (Multi Page Application)
JSP, PHP, ...
CSR, SSR
CSR (Client Side Rendering)
- Vue, React 등의 SPA framework에서 사용하는 방식
- 브라우저(client)에서 JS에 의해 view를 동적으로 생성. 때문에 page 전환이 SSR보다 상대적으로 빠르다. 대신 최초 접속 시 모든 JS와 static 파일을 가져와야 하기 때문에 최초 접속 시 로딩은 SSR에 비해 느리다.
- page 전환시 깜빡임이 없기 때문에 자연스러운 사용자 경험이 가능하다.
SSR (Server Side Rendering)
- PHP 등의 MPA(Multi Page Application)
- Web server에서 view를 생성한다. page가 전환될 때 마다 client가 서버에 view 요청을 하고 server는 그것을 생성 후 client에게 보내준다. 때문에 view 전환 속도가 CSR에 비해 상대적으로 늦다. 그리고 page 요청이 빈번해 질수록 CSR에 비해 서버 부하가 더 커진다.
- SEO(검색엔진 최적화) 관점에서 유리하다.
SSR은 사용자 정보를 서버측의 세션으로 관리할 수 있지만 CSR은 사용자에 대한 정보를 저장할 공간이 마땅치 않다.