[SPA] Single Page Application

References: 아하 프론트 개발기

 

 

1. SPA

 

Single Page Application. 페이지가 하나만 있는 웹페이지.

Client Side Rendering 방식으로 생명주기동안 리소스를 딱 한번만 로딩한다.

그 이후부턴 데이터를 받아올때만 서버와 통신하며 페이지를 이동하면 기존 페이지 내부를 수정하여 보여준다.

 

 

 

2. 장점

 

• 자연스러운 사용자 경험(UX)
• 필요한 리소스만 부분적으로 로딩(성능)
• 서버의 탬플릿 연산을 클라이언트로 분산(성능)
• 컴포넌트별 개발 용이(생산성)
• 모바일 앱 개발을 염두에 둔다면 동일한 API를 사용하도록 설계 가능(생산성)

 

3. 단점

 

• JavaScript 파일을 번들링해서 한 번에 받기 때문에 초기 구동 속도 느림(webpack 의 code splitting으로 해결)
• 검색엔진최적화(SEO)가 어려움 (SSR 로 해결)
• 보안 이슈 (프론트엔드에 비즈니스 로직 최소화)