Seonglae ChoAccelerated Mobile Pages
구글이 제시한 모바일 콘텐츠 최적화 표준
AMP전용태그의 사용을 제외하면 기존 사이트 제작시에도 사용할 수 있는 방법
비슷한 서비스로 애플의 애플 뉴스, 페이스북의 인스턴트 아티클
최적화 기술들을 모아논 방법론
- 외부 JS 제한
- CSS파일의 크기 제한(50byte)
- AMP 전용태그 사용
- AMP HTML
- AMP 자바스크립트
- 구글 AMP 캐시
AMP HTML과 AMP 자바스크립트로 만든 AMP 페이지를 구축한 후 구글에 AMP 사이트를 캐싱한다. 그 후 사용자가 페이지를 요청하면 원본 페이지가 아닌 구글에 저장된 AMP 페이지를 보여줌으로써 로딩시간을 단축
Speed Trap
“Accelerated Mobile Pages” succeeded in speeding up publishers’ mistrust of the search giant.
https://www.theverge.com/23711172/google-amp-accelerated-mobile-pages-search-publishers-lawsuit
%2Fcdn.vox-cdn.com%2Fuploads%2Fchorus_asset%2Ffile%2F24635758%2F226175_Google_AMP_Speed_Trap_KRadtke_002.jpg?table=block&id=12a347fd-3457-4ea4-9b9c-cedd2ab26af9&cache=v2)
namu.wiki
https://namu.wiki/w/%EA%B5%AC%EA%B8%80%20%EA%B0%80%EC%86%8D%20%EB%AA%A8%EB%B0%94%EC%9D%BC%20%ED%8E%98%EC%9D%B4%EC%A7%80
AMP 그게 뭐야?
최근 진행한 프로젝트에서 기존 메인페이지를 AMP버전으로 만들어볼 기회가 생겼습니다. AMP를 실제로 제작해보면서 느낀 점을 공유해보고자 합니다. AMP(Accelerated Mobile Pages) 직역하면 모바일 가속화 페이지 입니다. 모바일 환경에서 빠른 속도로 페이지를 렌더링하여 제공합니다. 또한 검색 결과를 카드 뉴스형태로 보여주는 등 아름다운(?) 검색 결과 화면을 얻을 수 있습니다 사용자가 모바일환경에서 Google검색엔진을 통해 검색을 하면 AMP페이지가 제공됩니다.
https://velog.io/@hongku/AMP-hnjy58td1h
AMP - a web component framework to easily create user-first web experiences
Whether you are a publisher, e-commerce company, storyteller, advertiser or email sender, AMP makes it easy to create great experiences on the web. Use AMP to build websites, stories, ads and emails.
https://amp.dev/
Brave is bypassing Google AMP pages because they're 'harmful to users'
Brave announced a new feature for its browser on Tuesday: De-AMP, which automatically jumps past any page rendered with Google's Accelerated Mobile Pages framework and instead takes users straight to the original website. "Where possible, De-AMP will rewrite links and URLs to prevent users from visiting AMP pages altogether," Brave said in a blog post.
https://www.theverge.com/2022/4/19/23032776/brave-de-amp-google-browser
