TIL 4주차 - 3. React 기초2

lim1313·2021년 8월 13일
0

부트캠프 TIL

목록 보기
14/49

SPA

SPA는 서버로부터 완전히 새로운 페이지를 불러오는 것이 아니라,
화면을 업데이트하기 위해 필요한 데이터만 서버에서 전달받아 브라우저에서 해당하는 부분만 업데이트하는 방식으로 작동하는 웹 애플리케이션이나 웹 사이트를 말한다.

SPA 장점

  1. 전체 페이지가 아닌 필요 부분의 데이터만 받이사 화면을 업데이트하면 되기 때문에 사용자와의 interaction에 빠르게 반응
  2. 서버 과부화 문제가 현저하게 감소
  3. 전체 페이지를 렌더링 할 필요가 없기 때문에 더 나은 유저경험 제공

SPA 단점

  1. JavaScript 파일의 크기가 크다. 때문에 JS 파일을 기다리는 시간으로 인해 첫 화면 로딩 시간이 길어진다.
  2. 검색 엔진 최적화가 좋지 않다.

검색엔진 최적화

구글이나 네이버같은 검색엔진이 자료를 수집하기 좋도록 웹 페이지를 구성하는 것을 뜻함.

검색 로봇이 웹 페이지에 있는 정보를 수집하고 분석해서 그 결과값에 인덱스를 만들어 보관하고 있다가 사용자가 검색어를 입력하면 보관하고 있던 인덱스에서 검색어와 가장 연관성이 높은 웹 페
이지들을 순서대로 보여주는 방식으로 작동.

검색 로봇은 자료를 수집할 때에 웹 페이지의 URL은 물론이고 HTML 문서 내의 각종 태그나 링크 등을 분석. SPA는 HTML이 거의 비어있다 보니 검색 로봇이 충분한 자료를 수집하지 못함.
이 때문에 검색 노출이 중요한 웹 애플리케이션은 검색 엔진 최적화에 대한 대응책을 따로 마련해야 하고, 더불어 앱 안에서 브라우저의 앞으로 가기/뒤로 가기 등의 상태 관리도 해야 하기 때문에 개발의 복잡도가 더욱 늘어남.

다만 SPA에서도 검색 엔진 최적화에 대응할 수 있도록 검색 엔진이 발전하고 있어서, 점차 이 단점은 사라지고 있는 추세.

profile
start coding

0개의 댓글