페이지 구성 방식 (SPA & MPA)

페이지 구성 방식SPAMPA
avatar
2025.04.10
·
3 min read

SPA (Single Page Application)이 란?

말 그대로 단 하나의 페이지로 이루어진 어플리케이션을 뜻한다.
단 하나의 HTML 파일을 기반으로 JavaScript를 이용해 동적으로 화면의 컨텐츠를 바꾸는 방식의 웹 어플리케이션이다.

MPA (Multiple Page Application)이란?

화면 마다 HTML파일이 존재하고, 사용자가 그 화면을 요청할 때마다, 웹 서버가 필요한 데이터와 HTMl로 파싱해서 보여주는 방식의 웹 어플리케이션이 다.

질문

Q. SPA가 사용하는 Rendering방식은 CSR이고, MPA가 사용하는 Rendering방식은 SSR인 것인가??
A. 그렇지 않다.

SPA는 서버로부터 처음에만 페이지를 받아오고 이후에는 동적으로 DOM을 구성하여 화면을 Rendering 하는 방식이다.
바로 여기서 "동적으로 DOM을 구성하여 화면을 Rendering 하는 방식"CSR (Client Side Rendering) 이다.

쉽게 말해 SPA는 처음에만 페이지를 받아오고 이후에는 받아오지 않는데, 이럼에도 데이터가 수정되고 조회되도록 하고 싶어 CSR이라는 방식을 채택한 것이다.

반대로 MPA는 동적이지 않은 페이지를 상황에 맞게 클라이언트에 뿌려주기 때문에 SSR 방식을 채택한 것이다.

결론

비교 대상이 아니라는 것이다.
SPAMPA는 페이지를 몇 개를 사용하느냐의 차이이고,
CSRSSR은 Rendering을 어디서 하느냐의 차이로
비교 대상이 되지 않는다.







- 컬렉션 아티클