Peach's CODE peach

공부한 내용을 정리중입니다. 틀린 내용이 있을 수 있습니다 : )

코딩하는 딱복

[개념] SPA & MPA, CSR & SSR 본문

개념정리 🗂️

[개념] SPA & MPA, CSR & SSR

yundi 2024. 6. 11. 14:03

💡 SPA 와 MPA ?

🗸 SPA [ Single Page Application ]

하나의 페이지로 구성된 웹 애플리케이션이다. => 기본 HTML 파일을 하나로 두는 것

다른 페이지로 이동할 때 필요한 부분만 수정하여 작성한다.

 

🗸 MPA [ Multi Page Application ]

여러 개의 페이지로 구성된 웹 애플리케이션이다.

다른 페이지로 이동할 때마다 해당 페이지의 HTML 파일을 서버로부터 다시 받아야 한다.

 

💡 CSR과 SSR ?

🗸 CSR [ Client Side Rendering ]

클라이언트에서 렌더링을 담당하는 방식으로, 서버에서 HTML과 JS파일을 받아 브라우저에서 실행시켜 준다.

- 초기 로딩 속도가 느리지만 그 이후의 로딩은 빠르다.

- 페이지 이동 시 깜빡임이 없다.

 

🗸 SSR [ Server Side Rendering ]

서버에서 렌더링을 담당하는 방식으로, 서버에서 사용자에게 보여줄 페이지를 모두 구성하여 페이지를 보여준다.

- 초기 구동 속도가 빠르지만 화면 깜빡임이 있다.

- SEO에 유리하다.

- TTV와 TTI 사이 간극이 있다.

 

💡 SEO ?

🗸 SEO [ Search Engine Optimization ]

검색 엔진 최적화라는 뜻으로 사용자의 검색의도를 명확히 이해하여 고객니즈 기반으로 웹사이트의 콘텐츠를 제작하고, 이 페이지가 검색 결과 페이지에서 잘 노출 되도록 웹페이지의 태그와 링크 구조를 개선하여 오가닉트래픽(Organic Traffic)을 늘리는 방법론이다.

 

+ Organic Traffic

광고나 소셜미디어, 리퍼럴 사이트와 같은 채널을 통해 사이트로 유도되는 트래픽을 제외하고 검색 엔진을 통해 곧바로 유입되거나 동일한 도메인 안에서 유입되는 트래픽을 말한다.

 

💡 TTV 와 TTI ?

🗸 TTV [ Time To View ]

사용자가 웹브라우저에서 내용을 볼 수 있는 시점

 

🗸 TTI [ Time To View ]

사용자가 웹브라우저에서 인터랙션 할 수 있는 시점

 

개발 관련 공부를 하다보면 생소한 단어가 계속 튀어나온다.. ㅎㅎ 거의 꼬꼬무이다 ㅠㅠ

내가 헷갈려서 빨리 찾기 위해 정리한 개념 ! ⭐️