> 웹 프론트엔드 > 프런트엔드 Q&A > 뷰 스파가 무슨 뜻인가요?

뷰 스파가 무슨 뜻인가요?

青灯夜游
풀어 주다: 2021-12-22 16:55:40
원래의
5569명이 탐색했습니다.

vue에서 스파의 전체 이름은 "단일 페이지 애플리케이션"이며 중국어로 "단일 페이지 애플리케이션"을 의미합니다. 단일 HTML 페이지만 로드하고 이를 동적으로 업데이트하는 애플리케이션입니다. 사용자는 페이지 웹 애플리케이션과 상호 작용합니다.

뷰 스파가 무슨 뜻인가요?

이 튜토리얼의 운영 환경: Windows 7 시스템, vue 버전 2.9.6, DELL G3 컴퓨터.

SPA in Vue

SPA(단일 페이지 애플리케이션, 단일 페이지 애플리케이션). 단일 HTML 페이지를 로드하고 사용자가 애플리케이션과 상호 작용할 때 해당 페이지를 동적으로 업데이트하는 웹 애플리케이션입니다.

웹페이지가 초기화될 때만 해당 HTML, JavaScript 및 CSS를 로드하세요. 페이지가 로드되면 SPA는 사용자 작업으로 인해 페이지를 다시 로드하거나 점프하지 않고 대신 라우팅 메커니즘을 사용하여 HTML 콘텐츠 변경, UI와 사용자 간의 상호 작용을 구현하고 페이지 다시 로드를 방지합니다.

기존 다중 페이지 프로그램과의 차이점:

기존 다중 페이지 프로그램: 서버에 대한 각 요청은 전체 페이지를 반환합니다.

단일 페이지 애플리케이션: 페이지가 처음 로드될 때만, 이후에는 매번 로드됩니다. 요청은 필요한 데이터만 얻습니다. 그런 다음 페이지의 js를 구문 분석하여 얻은 데이터가 페이지에 표시됩니다.

장점:

1. 요청 볼륨을 줄이고 페이지 응답 속도를 높이며, 서버에 대한 부담

2 더 나은 사용자 경험, 웹앱에서 네이티브 앱의 부드러움을 느낄 수 있음

단점:

기술이 ajax를 사용하기 때문에 페이지가 SEO에 도움이 되지는 않지만, 그럴 수는 있습니다. 다른 기술을 통해 우회

(SEO 원칙: 검색 엔진 스파이더는 href의 일반 하이퍼링크만 인식하고 JavaScript 코드는 인식하지 않습니다. 일반 하이퍼링크를 만나면 크롤링하지만 JavaScript를 만나면 크롤링하지 않습니다. 즉, 검색 엔진 )

1) 서버 측 렌더링 2) 페이지 정적화(크롤러를 위해 특별히 준비됨)

주요 기술 포인트:

1 ajax

2 앵커 포인트 사용(창 .location.hash #)

3개의 Hashchange 이벤트

구현 아이디어 :

앵커 값 변경 이벤트를 모니터링하고, 다른 앵커 값에 따라 해당 데이터를 요청합니다. ​

1개의 앵커(#)가 원래 사용되었습니다. 페이지 내 점프, 위치 지정 및 표시 해당 콘텐츠

2 SPA에서 앵커 포인트는 다양한 리소스 요청, 데이터 요청 및 콘텐츠 표시를 위한 식별자로 사용됩니다

[관련 권장 사항: "vue.js tutorial"]

위 내용은 뷰 스파가 무슨 뜻인가요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿