SPA(Single Page Application)
spa란 말 그대로 한개의 페이지를 가진 어플리케이션이다. 이런 SPA로 개발을 하는 이유는 크게 몇가지가 있다.
- 페이지 전체 새로고침 방지한다
- 사용자 친화적이다
- 초기 렌더링 후 데이터만 받아오기에 서버에 요청이 적다
- 프론트와 벡엔드의 분리로 업무 분업화 및 협업에 좋다
CSR(Client Side Rendering)
csr이란 클라이언트(사용자)가 요청시 랜더링되는 방식을 뜻한다.
즉, react를 예시로 사용자가 웹페이지를 요청하여 서버에서 html이라는 파일을 클라이언트에게 보내주면 html body안에는 root만 있게되고 이 후에 js파일을 다운 받아 동적으로 화면에 띄워준다. 이런 CSR의 단점은
- 느리다
- SEO(Search Engine Optimization)에 좋지 않다
이 있다. 이런 문제점을 해결하기 위해 SSR이 도입되었다.
SSR(Server Side Rendering)
SSR이란 웹사이트에 접속 시 서버에서 필요한 파일을 모두 만들어 사용자에게 보내주는 방식입니다. 장점으로는
- CSR보다 속도가 빠르다
- SEO에 적합하다
라는 장점이 있지만 단점도 있습니다.
- 전체적인 웹사이트를 서버에서 다시 받아오는 것과 동일하기에 깜박임 문제가 발생한다
- 사용자가 많을 수록 서버에 과부하가 걸리기 쉽다