구글 AMP

읽을거리 2016. 5. 19. 13:48

728x90
반응형

출처 : http://navercast.naver.com/contents.nhn?rid=122&contents_id=114566&leafId=122



구글 AMP 모바일 페이지를 더 빠르게

인터넷의 발달은 우리에게서 참을성을 앗아가고 있다. 웹 콘텐츠를 보기 위해 수 초를 기다려야 할 때, 많은 사람은 기다리기보다 차라리 웹 콘텐츠 소비를 포기한다. 웹페이지 로딩 시간이 10초가 될 경우 이탈률은 무려 58%에 이른다는 연구 결과도 있다. 구글이 주창한 ‘AMP’(Accelerated Mobile Pages) 프로젝트는 이 문제를 해결하고자 출범했다. 웹 구동 시간을 최대 4배 정도 단축해 더 나은 콘텐츠 소비 경험을 제공하고자 한다.

구글 AMP 프로젝트는 모바일 웹 로딩 시간을 단축하여 제공 <출처: AMP 프로젝트 홈페이지>

모바일  로딩 시간 단축하는 기술

구글 AMP <출처: 유튜브 동영상>

구글의 ‘AMP’ 프로젝트는 구글 ‘액셀러레이티드 모바일 페이지(Accelerated Mobile Pages)’ 프로젝트의 줄임말이다. 우리말로 옮기면 ‘가속 모바일 페이지’쯤 되겠다. AMP는 지난 2015년 10월부터 구글이 전세계 30곳 이상의 매체 및 기술 파트너들과 함께 발표한 오픈소스 이니셔티브(Open Source InitiativeOSI)다.

AMP의 핵심은 모바일 웹 로딩 시간 단축이다. 모바일 웹은 PC 웹과 달리 운영체제(OS), 기기 성능, 통신망 구축 정도에 따라 웹페이지가 뜨는 시간이 큰 차이가 날 수 있다. 많은 사용자가 모바일에서 콘텐츠를 소비하고 있다는 현실도 AMP 프로젝트 배경에 깔려 있다. 구글 AMP를 적용하면 클릭과 거의 동시에 콘텐츠를 볼 수 있다. 웹페이지를 띄우는 속도는 일반 웹사이트와 비교했을 때 4배 정도 빠르다. AMP 프로젝트는 페이지 로딩 시간을 단축해서 긴 페이지 로딩 시간이 불러오는 사용자 이탈을 막고, 사용자에게 더 나은 콘텐츠 소비 경험을 제공하고자 한다.

리처드 깅그라스(Richard Gingras) 구글 뉴스 총괄 <출처: 구글코리아>

리처드 깅그라스 구글 뉴스 총괄은 “모든 사용자를 위한 모바일 웹 환경을 개선하는 데 한 걸음 다가간 것”이라며 “AMP를 활용하면 모든 오픈 모바일 웹과 앱에서 간편하게 콘텐츠를 신속히 로드할 수 있다”라고 AMP의 의의를 설명했다.

AMP HTML <출처: AMP 프로젝트 홈페이지>

AMP HTML은 일반 HTML 페이지와 동일하다. 다만 몇 가지 기능이 포함돼 있다는 점이 다르다. AMP HTML을 사용하면 웹사이트에서 표준 웹페이지보다 가벼운 버전의 페이지를 구축할 수 있으며, 서식이 많은 웹페이지와 스마트 광고도 즉시 띄울 수 있다. 다양한 플랫폼, 앱, 웹브라우저, 기기에 걸쳐 동일한 코드 작업을 할 수 있다는 장점도 있다.

AMP 작동 원리

모바일 웹 로딩 시간은 OS, 기기 성능, 통신망 구축 정도에 따라 차이가 난다. <출처: AMP 소개 유튜브 동영상>

AMP의 작동 원리는 대략 3단계로 나뉜다. 핵심은 ‘캐싱’(Caching)이다.

페이지 구성 단순화: 자바스크립트 코드를 최소화한다. 필요한 기능은 태그 컴포넌트로 만들어둔다. 구글은 ‘AMP 자바스크립트’라는 라이브러리를 제공한다.

대역폭 최적화: 최적화된 해상도 이미지를 찾아 기기에 최적화된 콘텐츠를 노출하고, 비동기 로딩을 통해 뉴스 소비 경험을 개선한다. 비동기 로딩이란, 뉴스를 읽는 데 핵심이 되는 텍스트를 먼저 띄우고 용량이 큰 이미지를 나중에 받는 방식이다.

페이지 캐싱: 구글은 AMP를 적용한 뉴스 데이터를 저장(캐싱)한다. 사용자가 뉴스를 읽겠다고 요청하면, 언론사의 서버가 아니라 미리 캐싱한 데이터를 보여줌으로써 로딩 시간을 획기적으로 줄인다.

AMP를 적용한 페이지는 기존 모바일 최적화 페이지보다도 훨씬 빠르게 뜬다. 데이터도 적게 쓴다. iOS와 안드로이드OS 앱에서 AMP를 테스트하고 있는 핀터레스트는 AMP 페이지가 기존 모바일 최적화 페이지와 비교해 로딩은 4배 빠르면서도 데이터 사용량은 8분의 1 수준이라고 밝혔다.

콘텐츠 소비 경험 개선 도모

AMP를 적용한 모바일 웹과 미적용한 모바일 웹의 차이 <출처: 핀터레스트 엔지니어링 블로그>

AMP를 적용한 모바일 웹

AMP를 미적용한 모바일 웹

AMP는 많은 언론사와 파트너십을 맺고 기술을 공급하고 있다. AMP가 사용자에게 제공하는 ‘빠른 로딩’은 콘텐츠 소비 경험의 개선을 목표로 한다. ‘뉴스’는 웹에서 만날 수 있는 가장 흔한 콘텐츠다. AMP의 1차 목표는 흔한 콘텐츠의 소비 경험을 개선해 사용자의 전반적인 모바일 웹 사용 경험의 품질을 끌어올리는 데 있다.

AMP를 적용한 <연합뉴스> 기사 <출처: 블로터>

서비스 사업자에게 사용자 경험의 개선은 생존 문제와 연결돼 있다. 같은 콘텐츠의 소비 위치를 두고 경쟁하고 있는 서비스라면 더욱 그렇다. 구글의 AMP 프로젝트도 이 맥락에서 해석할 수 있다. 페이스북도 제한적으로 시범 운영했던 ‘인스턴트 아티클(Instant Articles)’을 4월부터 모든 언론사에 개방하고 있다. 구글과 페이스북이 모두 워드프레스와의 연동 방안을 공개한 것도 이와 무관하지 않다. 콘텐츠 관리도구(CMS)가 강점인 워드프레스는 전체 웹의 25% 이상을 차지하고 있다. 웹 콘텐츠의 주요 소비처가 되기 위해 구글과 페이스북이 경쟁하고 있는 모양새다.

워드프레스용 AMP 플러그인 <출처: 워드프레스>

구글의 경영철학 중 하나는 ‘사용자에게 초점을 맞추면 나머지는 저절로 따라온다’이다. 구글은 사용자가 최대한 빨리 구글의 웹사이트를 떠날 수 있도록 검색 환경의 효율과 속도를 높이는 것을 임무로 삼고 있다. 사용자에게 최상의 경험을 제공하는 것은 구글의 현재 위치를 만든 동력이며, 지배적인 위치를 유지해 온 핵심 철학이다. 구글은 검색 전문 업체이고, 광고가 주 수입원이다. 검색의 대상이 되는 콘텐츠가 좋아질수록, 구글을 사용할 때의 편익도 올라간다. 명분이 이익이 되기에 가능한 구도다.

그러나 최근 소셜미디어의 확산으로 콘텐츠 소비의 중심이 닫힌 앱으로 이동하는 흐름이 거세지고 있다. 대표적인 사례가 앞서 언급한 페이스북의 인스턴트 아티클이다. 향후 AMP 프로젝트의 성공 여부는 콘텐츠 소비처로서의 ‘열린 웹’과 ‘닫힌 앱’의 경쟁을 바라보는 중요한 분기점이 될 전망이다.

참고문헌
채반석 | 블로터 기자

발행2016.05.05.


반응형

'읽을거리' 카테고리의 다른 글

오픈소스 DBMS  (0) 2016.07.14
깃허브  (0) 2016.07.14
클라우드 IDE  (0) 2016.07.14
웹 접근성  (0) 2016.07.14
노드JS (node js)  (0) 2016.05.19