Angular의 단일 페이지 애플리케이션

1. 단일 페이지 애플리케이션 작동 방식
2. 단일 페이지 애플리케이션 사용의 이점
3. 결론

Angular 프레임워크는 일반적으로 SPA로 알려진 단일 페이지 애플리케이션을 만드는 것으로 주로 알려져 있습니다.

SPA는 웹 사용자가 전체 웹 페이지를 완전히 로드하지 않고도 웹 사이트의 다양한 링크를 탐색할 수 있도록 하는 응용 프로그램입니다. 모든 탐색은 동일한 페이지에서 수행됩니다.

SPA는 웹 브라우징 세계에서 점차 주목을 받고 있습니다. SaaS (Software as a Service) 애플리케이션이라고도 하는 대부분의 소셜 미디어 앱은 단일 페이지 애플리케이션으로 설계되었습니다.

사용자는 Twitter와 같은 소셜 미디어 앱을 사용할 때 브라우저의 동일한 프레임 내에서 탭 사이를 이동하는 것처럼 보입니다. 사용자는 미디어 앱이 처음부터 로드되는 것을 거의 보지 못합니다.

단일 페이지 애플리케이션 작동 방식

전통적인 웹 애플리케이션에 대해 논의할 때 데이터는 일반적으로 서버 측/백엔드에서 HTML로 변환됩니다. 그러나 단일 페이지 애플리케이션이 처음 실행되면 렌더링 프로세스가 서버 측에서 클라이언트로 이동합니다.

HTML은 사용자가 웹 페이지 내에서 탐색할 때만 네트워크를 통해 전송됩니다. 따라서 SPA가 실행 중일 때 데이터만 서버로 전송되지만 HTML은 동일하게 유지됩니다.

웹 페이지가 더 빨리 로드되는 것처럼 보이게 하여 훨씬 더 향상된 사용자 경험을 제공합니다. 누가 기다리기를 좋아합니까?

단일 페이지 애플리케이션 사용의 이점

다음은 Angular와 같은 단일 페이지 애플리케이션을 사용할 때 알려진 몇 가지 이점입니다.

향상된 사용자 경험

단일 페이지 애플리케이션의 사용자 경험이 더 부드럽게 느껴집니다. 페이지가 처음으로 로드되면 모든 데이터가 클라이언트 측으로 전송되므로 웹 애플리케이션의 다양한 섹션 간 탐색이 더 빠르게 로드되고 대역폭이 덜 소모됩니다.

더 저렴한 웹사이트 제작 비용

SPA는 사용자가 탐색할 때 더 적은 대역폭을 사용합니다. 이는 구축 중인 웹사이트의 소유자가 대역폭 구입에 드는 비용을 줄여 완전한 기능을 갖춘 웹사이트를 만드는 데 드는 전체 비용을 줄인다는 의미입니다.

배포 용이성

SPA의 클라이언트 측에서 HTML, CSS 및 Javascript 번들은 프로덕션 환경에 쉽게 배포됩니다. 이 세 파일을 제공하는 정적 서버만 있으면 됩니다.

코드 분할

코드 분할을 사용하여 웹 번들을 여러 부분으로 분할할 수 있습니다. 특히 이미 완성된 번들의 일부를 변경하지 않기 위해 파일 섹션에서 작업해야 하는 경우 파일에 대해 독점적으로 작업하기가 쉽습니다.

쉬운 버전

향후 조정 및 업그레이드를 쉽게 하기 위해 단일 페이지 애플리케이션의 프런트엔드 부분은 버전이 매우 간단합니다. 따라서 한 시점에서 이전 버전이 버그 없이 완벽하게 작동한다면 개발자는 필요한 경우 이 버전으로 쉽게 롤백할 수 있습니다.

결론

SPA는 아직 주류가 아니기 때문에 Google과 같은 웹 애플리케이션은 완전히 작동하지 않습니다. 페이지가 SPA로 제대로 인덱싱되지 않기 때문입니다.

SPA 사용의 기술적 이점과 용이성은 개발자가 Amazon과 같은 대규모 웹 사이트가 단일 페이지 애플리케이션에서 완전히 작동할 수 있도록 하는 방법을 계속 찾을 것임을 의미합니다.