AMP 기반 PWA로 모바일 웹 환경의 속도를 4배 높이고 수익을 25% 늘린 Mynet

MyNet 세부정보

Mynet은 매달 3,400만 명 이상의 사이트 방문자에게 뉴스, 동영상, 게임, 금융, 정보, 엔터테인먼트 콘텐츠와 서비스를 제공하고 있습니다. 콘텐츠에 AMP (Accelerated Mobile Pages)를 사용하는 프로그레시브 웹 앱 (PWA)을 출시한 후 평균 페이지 로드 시간이 4배 감소했습니다. 또한 Mynet의 모바일 사이트 평균 이용 시간이 43% 증가하는 등 사용자 참여가 크게 증가했습니다.

  • 기사 페이지 조회당 수익 25% 증가
  • 평균 페이지 로드 속도 4배 향상
  • 평균 사이트에 머문 시간 43% 증가
  • 세션당 페이지 조회수 34% 증가
  • 이탈률 24% 감소

당면 과제

모바일 트래픽의 85% 이상이 모바일 웹에서 발생하는 Mynet의 모바일 웹사이트는 전략에 없어서는 안 될 요소입니다. 이 과정에서 네이티브 앱 사용자보다 모바일 사이트에서 보내는 시간이 2배 적었습니다. Mynet은 모바일 사이트에서의 사용자 행동을 분석한 결과 모바일 웹 환경이 너무 느리다는 것이 분명해졌습니다. Mynet은 네이티브 앱으로 달성한 것과 비슷한 매우 빠르고 참여도 높은 모바일 웹사이트를 구축해야 했습니다.

해결 방법

Mynet은 트래픽과 재참여를 동시에 촉진하기 위해 AMP를 사용해 모바일 웹에서 앱과 같은 빠른 경험을 제공하는 PWA를 출시했습니다. 이 설정을 사용하면 기사 페이지가 이전 모바일 사이트에 비해 4배 더 빠르게 로드됩니다. 이에 따라 이탈률은 24% 나 감소했습니다. 또한 사용자가 사이트에서 43% 더 많은 시간을 보내기 시작했기 때문에 Mynet은 속도와 참여도 간의 상관관계를 확인했습니다. 또한 세션당 페이지 조회수가 34% 증가했습니다. 이 모든 것은 여러 단계로 이루어졌습니다.

AMP로 빠르게 시작하기

Mynet은 처음에 독립형 AMP 페이지로 제공되는 기사 지원 기능을 구축했습니다. 이렇게 하면 Google 검색결과의 AMP 캐러셀에 결과가 표시됩니다. 또한 모바일 웹에서 콘텐츠를 탐색하는 사용자에게 탁월한 페이지 로드 성능을 제공할 수 있으며, 이는 제한적이거나 불안정한 네트워크에서 매우 중요합니다. 독립형 AMP 페이지를 출시하는 것은 CMS 시스템에서 큰 문제가 아니었으며 모든 기사 콘텐츠를 AMP로 출시하는 데 2주밖에 걸리지 않았습니다.

Mynet은 광고를 최대한 빠르고 효율적으로 게재하기 위해 AMP 광고를 출시했습니다. 이러한 광고는 일반 광고보다 최대 2배 빠르게 로드되며 클릭률 (CTR)과 수익은 최대 30% 증가합니다.

PWA로 속도 유지 및 재참여 유도

다음으로 Mynet은 모바일 웹사이트를 개선하기 위해 PWA 기술을 사용하여 별도의 모바일 사이트 베타 버전을 빌드했습니다. 이러한 기술을 통해 기본 사이트를 최소한으로 업데이트하는 대신 앱과 좀 더 몰입도 높은 사용자 환경 (UX)을 제공하고자 했습니다. 특히 취약한 네트워크에서 안정적인 성능을 제공하기 위해 서비스 워커를 활용했으며, '홈 화면에 추가' 사용자 프롬프트와 재참여를 위한 푸시 알림을 활용했습니다. Lighthouse 성능 점수가 95/100점인 동급 최고의 PWA를 제작했습니다. Lighthouse는 웹의 모든 페이지에서 실행할 수 있는 웹페이지의 품질을 개선하기 위한 자동화된 도구입니다.)

AMP와 PWA를 함께 사용하면 더 효과적입니다

Mynet은 AMP 및 PWA를 독립형 버전으로 테스트하고 성능을 최적화한 후, 모바일 웹사이트용 통합 솔루션을 빌드하는 마지막 단계로 넘어갈 준비가 되었습니다. AMP 콘텐츠 페이지를 PWA 내에 배치한 결과 새로운 모바일 사이트의 속도와 사용성이 향상되었습니다. 통합된 AMP/PWA 사이트가 출시되자 Mynet은 모바일과 데스크톱의 웹 프로덕션 버전 수를 절반으로 줄임으로써 코드를 유지하고 개선하는 데 필요한 구현 수를 줄였습니다.

AMP/PWA 통합 솔루션을 사용해야 하는 이유 AMP는 모바일 웹에서 뛰어난 첫 페이지 로드 성능을 제공하는 반면, PWA는 재방문자의 빠르고 안정적인 성능을 제공합니다. PWA에서는 '홈 화면에 추가' 메시지와 푸시 알림 덕분에 사이트에서 사용자의 재참여를 유도할 수도 있습니다. Mynet은 이 전략을 함께 사용하면 네트워크 상태와 관계없이 첫 방문 또는 재방문 시 고품질 경험을 제공할 수 있습니다.

Mynet의 모바일 웹사이트 방문자 중 약 30% 는 iOS 기기를 사용합니다. Mynet은 '홈 화면에 추가', 푸시 알림 및 iOS의 서비스 워커 지원 부족으로 오프라인 캐싱을 사용할 수 없음에도 불구하고 iOS에서 세션당 평균 페이지 조회수가 15% 증가하고 이탈률은 23% 감소했습니다. 이러한 참여도 증가는 AMP 기반 PWA가 제공하는 속도 및 사용자 인터페이스 (UI) 개선 덕분입니다.

PWA 내에서 AMP를 사용할 때의 전반적인 영향은 기사 페이지 조회당 광고 수익이 25% 증가하는 것입니다.

속도에 다시 초점을 맞춰 AMP를 통합하고 프로그레시브 웹 앱을 빌드하기로 했습니다. 페이지 이탈을 줄이는 데 AMP가 중요했는데, 이제는 AMP 페이지 로드 속도가 4배 더 빨라졌습니다. PWA를 빌드하여 앱과 동일한 기능을 달성했으며, 이제 사용자는 사이트에서 43% 더 많은 시간을 보내고 재참여 빈도도 더 높았습니다.

M. 푸아트 세커, Mynet 비즈니스 개발 및 제품 그룹 관리자

추가 결과

  • AMP 광고로 로드 시간 2배 단축
  • AMP 광고로 CTR 및 수익 30% 증가
  • iOS의 세션당 평균 페이지 조회수 15% 증가
  • iOS에서 이탈률 23% 감소