ネイティブ広告プラットフォーム「LOGLY lift」を提供しているログリーは、Accelerated Mobile Pages(AMP)環境で従来のタグよりも高速化を実現した新しいレコメンドウィジェットを開発しました。
目次
開発の背景
媒体のページ速度向上やユーザー体験の向上を目的に、コンテンツとは別にamp-adを用いた広告を実装することでマネタイズが可能なAMPページを実装する媒体社が増えています。また、コンテンツの記事下に、編集コンテンツへのリンクと広告が一体化したレコメンドウィジェットを設置する機会も増えてきました。
その際、Google Ad Managerで発行した広告タグを用いて複数事業者のレコメンドウィジェットのタグを振り分ける(アロケーション)ことにより、常時A/Bテストを行うことが主流となっていますが、各社独自のJavaScriptを実行している広告タグは、ページの読み込みが遅れることや広告の表示にタイムラグが発生するケースも存在します。
そこで同社は、AMPコンポーネントを利用し、外部サーバーからコンテンツに必要な情報を動的に取得できるamp-listを用いてレコメンドウィジェットの実装を行うことで、さらなる高速化を実現しました。
amp-listは、広告とコンテンツを掲出する必要があるレコメンドウィジェットの要件に適しています。データのみを取得し、それを元にAMP HTMLで描画されることから、amp-adを用いた場合に比べて高速に描画することが可能です。ただし、タグの配置のみでよいamp-adと異なり、HTML(amp-list template)やCSSを記述する必要がある分、amp-adよりも導入は手間になります。
性能評価試験の概要
AMPページに、amp-ad(A)とamp-list(B)それぞれによって実装したレコメンドウィジェットを設置し、同一指標において比較。描画速度等の有意差を検証しました。なお、それぞれのタグ以外のコンテンツ条件は同一とし、純粋なタグのパフォーマンスを計測できるようにしています。
・A… Google Ad Manager経由で配信される従来のタグ (amp-ad)
・B…amp-listを用いた新しいタグ(amp-list)
検証ツールには、WebPageTestを利用しました。検証は、Waterfall、Speed Index、Time to Interactive(TTI)、Processing Breakdownの4つの指標で行っています。
・Waterfall
Webページのロード時に送られるリクエスト毎に生じた時間を測る指標。
・Speed Index(スコアが低いほどパフォーマンスが高くなる)
ページのロード開始から経過時間に対する画面の描画進捗を用いて計測するページの読み込みパフォーマンスにおける指標。
・Time to Interactive(TTI)
Webページのロードが終わって、ユーザーの入力に対して確実に応答できるようになったタイミングのことです。
・Processing Breakdown
(IDLE状態を除いて)ブラウザのメインスレッドがどの処理にどれだけの時間を割いたかを示します。

性能評価試験の結果
amp-ad(A)とamp-list(B)それぞれを実装したページに対して、各指標で5回の性能評価試験を実施した結果、Waterfallは従来型のamp-adに比べてamp-listを用いた場合に1.5倍、SpeedIndexでは1.6倍、Time to Interactiveでは1.2倍、Processing RenderingFrameでは3.3倍速く、すべての指標でamp-listが優れていました。
amp-listを用いたレコメンドウィジェットでは、amp-adに比べて1.5~3倍の描画速度になるため、ユーザー体験の向上と回遊性、収益性の向上が見込まれる場合があります。導入した媒体では、回遊性、収益性が約30%~50%向上したケースも存在しました。
