> 웹 프론트엔드 > H5 튜토리얼 > Google이 AMP 프로그램을 시작한 이유는 무엇인가요?

Google이 AMP 프로그램을 시작한 이유는 무엇인가요?

PHPz
풀어 주다: 2017-04-02 11:13:05
원래의
2584명이 탐색했습니다.

Google이 AMP 프로그램을 출시하는 이유는 무엇인가요?

Google은 최근 모바일 웹페이지의 로딩 속도를 향상시키기 위해 AMP라는 웹 가속 프로젝트를 발표했습니다. AMP는 오픈 소스 프로젝트로, 코드를 작성할 수 있는 HTML, CSS, JavaScript를 제한할 수 있습니다. Google은 이 기술이 Nexus 5 휴대전화의 3G 네트워크 환경에서 웹 페이지 로딩 속도를 15~85% 향상시키는 데 도움이 될 수 있다고 밝혔습니다. Google AMP와 Baidu MIP는 SEO에 영향을 미칩니다. Impact )

이 프로젝트의 기술적 핵심은 HTTP 요청을 최소화하고 전체 웹페이지 콘텐츠를 동시에 로드할 수 있는 AMP HTML이지만, 이 기술은 애니메이션 및 스크롤 막대와 같은 CSS를 제한합니다. 이러한 콘텐츠는 영향을 받을 수 있으며, JavaScript 코드를 사용하는 콘텐츠는 지원되지 않습니다.

원래 휴대폰 사이트의 특정 문제는 무엇인가요? 솔루션에 대해 논의하기 전에 문제를 탐색하는 데 약간의 시간을 할애할 가치가 있습니다. 모바일 장치에서 많은 내용을 읽으신다면 휴대폰에서 또는 컴퓨터에서 페이지가 얼마나 느리게 로드되는지 이미 알고 계실 것입니다. 불규칙하게 렌더링되고 이상한 방식으로 상호작용하는 데에는 주로 두 가지 이유가 있습니다.

Google이 AMP 프로그램을 시작한 이유는 무엇인가요?

제3자 간섭

광고 삽입과 일부 추적 및 분석 기술로 인해 사용자가 제한된 대역폭과 CPU 처리 장치를 보유하고 있는 경우에도 페이지가 요청 수를 증가시킵니다. 더욱이 페이지는 여러 document.write() 호출 기능을 삽입하여 마치 광고용인 것처럼 동작하는 경우가 많습니다. 뉴욕타임즈는 최근 iOS폰에 콘텐츠 차단 소프트웨어를 설치한 후 페이지 크기가 늘어난다는 테스트를 진행했다. 🎜>

대부분의 반응형 웹사이트는 모든 화면 크기에서 잘 작동하지만 이로 인해 휴대폰에 표시될 때 많은 데스크톱 디스플레이 리소스를 소비하게 됩니다. Paul Irish가 Reddit의 성능을 조사한 결과, 오버헤드의 일부는 Reddit의 마스코트에 대한 svg 렌더링 사용으로 추적될 수 있으므로 마우스를 가리키면 애니메이션 효과를 표시할 수 있습니다(타사 라이브러리를 기반으로 하며 이는 높은 오버헤드를 의미함). 이는 상황이 아닙니다. 모바일 기기에서 리소스를 자주 찾을 수 있는 곳

Facebook에 따르면 설문조사(PDF, 3.4MB)에 따르면 모바일 기기에서 기사가 로드되는 평균 시간은 8초입니다. 인스턴트 아티클, Apple 뉴스 및 AMP를 로드하는 데 8초가 걸리는 것은 분명히 과장된 것입니다. 이는 두 번째 Vine 비디오를 탐색하는 데 충분한 시간입니다. 객관적으로 말하면 오늘날의 기준으로 보면 로드하는 데 시간이 오래 걸리는 것 같습니다.

Facebook 인스턴트 아티클과 Apple News의 공통점은 다음과 같습니다.

인앱 경험

독자는 Facebook을 통과합니다. 휴대폰의 앱은 Facebook 인스턴트 아티클에 액세스하는 데 사용되는 반면 Apple News는 iOS 9에서 완전히 별도의 앱을 사용합니다. 두 플랫폼 모두 사용자가 앱 외부에서 기사를 읽는 것을 허용하지 않습니다. 특별히 설계된 RSS 업데이트 애플리케이션이라고 생각하면 됩니다.

신디케이션 중심

그러나 Facebook과 Apple은 서로 다른 신디케이션 형식을 사용합니다(Apple News 형식은 JOSN을 기반으로 하는 반면 인스턴트 아티클 마크업은 HTML 태그가 다소 RSS 피드) 모두 동일한 원칙을 기반으로 합니다. 콘텐츠 관리 시스템을 속여 필요한 신디케이션 형식을 생성하면 Facebook과 Apple이 이를 추출, 구문 분석 및 아름답게 만들기 위해 쉬지 않고 작업합니다. 사용자 정의 렌더링.

경험 지향

Facebook 인스턴트 아티클과 Apple News는 모두 성능에 중점을 두지만 기사를 더욱 현대적으로 보이게 만드는 데에도 중점을 둡니다. 두 플랫폼 모두 매끄럽고 유동적인 인터페이스를 생성할 수 있는 구성 요소를 갖추고 있으며, 이는 일반적으로 사용자 정의가 가능하고 손으로 제작한 독서 경험을 제공합니다.

반면 AMP에는 또 다른 초점이 있습니다.

웹 페이지 기반 경험

AMP 파일이 설계됩니다. 브라우저와 WebView에서 렌더링됩니다.

Atomic 파일

AMP 파일은 AMP 런타임에서 검증, 구문 분석 및 부분적으로 렌더링되어야 하지만 서버나 CDN에 완전히 독립적인 파일로 캐시됩니다. 어느 시점에 기사로 변환되어 앱에서 렌더링될 수 있는 일부 소스 데이터 세트보다 말이죠.

성능 지향

AMP는 상호작용 모드나 미적 요소에 비해 성능에 더 중점을 둡니다. AMP 파일이 모두 작다는 말은 아니지만(올바른 스타일을 사용하면 Facebook 인스턴트 아티클이나 Apple 뉴스만큼 매력적일 수 있습니다), 말도 안 되는 작은 것들과 같은 멋진 시각적 요소를 제공하는 대신 어떻게 해야 할지에 더 관심을 갖습니다. 기사를 더 빠르게 렌더링합니다.

Google은 이제 검색 제품에 AMP HTML을 사용합니다. 아직 기술에는 일부 한계가 있지만 구글은 BBC, 뉴욕타임스, 버즈피드 등 30개 출판사와 기술 기업이 프로젝트에 참여했다고 밝혔다.

이러한 초기 기술 매개변수는 변경될 수 있지만 AMP의 기술 사양은 웹사이트에서 시험해 볼 수 있도록 Github에 게시되어 있습니다.

Google은 현재 모바일 독서 환경을 개선하기 위해 열심히 노력하고 있습니다. 이 기술에는 여전히 몇 가지 단점이 있지만 모바일 단말기가 트래픽의 37%를 차지하므로 점점 더 많은 웹사이트가 AMP 프로그램에 참여하게 될 것입니다. 현재Baidu, Sogou, Yahoo가 AMP를 공식적으로 지원하고 있습니다!


위 내용은 Google이 AMP 프로그램을 시작한 이유는 무엇인가요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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