🚀SPA

• Single Page Application
• SPA의 등장에 대해서 알아보자.

---

⌛전통적인 Web Application

• 사용자가 웹사이트 내의 다른 페이지로 이동하면, 브라우저가 페이지를 보여주기 위해 매번 HTML 파일로 된 페이지 전체를 불러와야 했다.
• 웹사이트가 보다 복잡해지고 애플리케이션의 형태를 가지게 되면서, 사용자와 서비스 사이에 많은 상호작용이 일어나게 되었다.
• 중복되는 요소들을 매번 불러오는 것이 불필요한 트래픽을 발생시켰고 사용자는 불편함을 얻게 되었다.
• 그래서 SPA가 등장하게 된다.

⏰SPA의 등장!

• SPA는 서버로부터 완전히 새로운 페이지를 불러오지 않는다.
• 화면을 업데이트하기 위해 필요한 데이터만 서버에서 전달받아 브라우저에 해당하는 부분만 업데이트하는 방식으로 작동한다.
  (ex. SNS의 좋아요 : 좋아요를 누른다고 해서 다시 전체 페이지가 로딩되지는 않는다! )

---

💙SPA의 장점

• 전체 페이지가 아니라 필요한 부분의 데이터만 받아서 화면을 업데이트 하기에 사용자와의 인터랙션에 빠르게 반응
• 서버에서는 요청 데이터만 주면 되기에 서버 과부하 문제가 현저히 낮다.
• 전체 페이지를 렌더링 할 필요가 없기에 더 나은 유저경험을 제공한다.

💔SPA의 단점

• SPA 경우 JS 파일의 크기가 크다. 때문에 JS 파일을 기다리는 시간으로 인해 첫 로딩 시간이 길다.
• 검색 엔진 최적화(SEO)가 좋지 않다. 구글이나 네이버는 HTML 파일에 있는 자료를 분석하는 방식으로 검색되는데, SPA의 경우 HTML 파일에 별 자료가 없기 때문이다.
  But 최근에는 SPA에서도 검색 엔진 최적화에 대응할 수 있도록 검색 엔진이 발전하고 있어서, 점차 이 단점은 사라지고 있는 추세이다.