MPA 는 전통적인 Page Routing 방식으로, 각각의 페이지 이동 마다 새로운 페이지를 렌더링 한다.
MPA
페이지가 이동 할 때 마다 새로운 페이지를 웹서버에 요청하고 응답을 받으면 브라우저가 새로고침 되듯이 깜빡이면서, 페이지 이동을 하게된다.
SPA (Single Page Applicaition)
React 는 MPA(Multi Page Application) 방식이 아니라, SPA(Single Page Application) 방식을 사용한다. SPA 는 말 그대로 단일 페이지 어플리케이션 이라는 뜻으로, 페이지가 하나만 존재하는 간단한 어플리케이션 이다.
SPA 페이지 이동을 하기 위해 새로운 페이지를 요청을 해도 page 가 하나만 존재하기 때문에 다른 페이지를 응답해 줄 수 없다.
MPA 방식의 웹 페이지는 페이지가 이동할 때마다 페이지가 새로고침 되듯이 깜빡거렸다면, SPA 방식은 CSR(Client Side Rendering) 방식을 따르기 때문에 페이지가 이동할 때, 깜빡이지 않는다.
CSR (Client Side Rendering)
CSR 은 클라이언트 측 에서 페이지를 알아서 렌더링 하는 방식이다.
CSR(Client Side Rendering)
페이지를 이동할 때 서버에게 페이지를 요청하여 응답 받는 것이 아니라, 브라우저에서 REACT APP 이 페이지를 알아서 업데이트 시켜준다. 페이지를 이동할 때 마다 서버와 통신하여 기다리는 시간 자체가 없어지기 때문에 Page 전환 자체가 굉장이 빨라진다.
CSR(Client Side Rendering) 만약, 데이터가 필요한 경우 서버와 데이터만 요청하고 전달받게된다.
MPA 방식은 페이지 이동 시 데이터들 (html 문서, 서버 데이터 등) 을 한꺼번에 조립해서 응답 받아 시간이 오래 거렸다면, SPA 방식은 페이지 이동 시 페이지 부터 변경 시키고, 데이터가 필요할 때마다 서버와 통신하여 데이터를 가지고 오기 때문에 굉장히 빠르게 페이지 이동을 할 수 있다.
React 는 단일 페이지로 구성되는 SPA 방식을 따르면서, CSR 로 페이지를 렌더링 한다.
