[React] SPA가 무엇인가요?

Yoongja·2022년 6월 16일
post-thumbnail

전통적인 웹은 새로운 페이지를 요청할 때마다 정적 리소스가 다운로드되고, 전체 페이지를 다시 렌더링 하는 방식으로 사용하여, 변경이 필요없는 부분을 포함하여 전체페이지를 갱신하는 비효율적인 방법을 사용하였습니다. 이는 웹 애플리케이션의 규모가 커짐에따라 , 속도가 느려지는 문제를 야기했습니다.

SPA(Single Page Application) 이란 서버로부터 새로운 페이지를 불러오지 않고 현재의 페이지를 동적으로 다시 작성함으로써 사용자와 소통하는 웹사이트를 의미한다.
즉, html,css,js파일을 최초 1회만 로드하고 이후에는 js파일을 통해 dom또는 필요한 html파일을 조작하는 방식을 취한다.

✨SPA 특징

새롭게 갱신되는 부분만 렌더하기 때문에 화면 깜빡임 없이 빠른 화면 이동이 가능하다.
트래픽의 감소와 속도,반응성의 향상이 특징이다.
모듈화 또는 컴포넌트별 개발이 용이하다.
백엔드와 프론트엔드가 비교적 명확하게 구분된다.
웹 애플리케이션에 필요한 정적 리소스를 한번에 다운로드 하기 때문에 초기 구동 속도가 느리다.
데이터 처리를 클라이언트에서 하는데 해당 로직이 JS를 통해 구현되므로 코드가 외부에 노출되는 보안 문제가 생긴다.
검색엔진 최적화(SEO)가 어렵다.

profile
Belief in the possibility

0개의 댓글