Monrif が Speculation Rules のプリレンダリングとバックフォワード キャッシュでエンゲージメントを 8.9% 向上させ、LCP を 17.9% 削減した方法

Fabrizio Guerra
Fabrizio Guerra
Gianni Onnis
Gianni Onnis

公開日: 2025 年 12 月 9 日

Monrif はイタリアの大手出版グループの 1 つで、Il Resto del CarlinoIl GiornoLa NazioneQN Quotidiano.net などのトラフィックの多いニュース ブランドを運営しています。セッションごとに何十もの記事にアクセスするユーザーが数百万人にのぼるため、読者の維持とエンゲージメントには、ナビゲーションの速度とページ読み込み時間の最適化が不可欠です。

2025 年初頭、Monrif は Speculation Rules API を使用した効果的なプリレンダリング戦略を採用することで、Largest Contentful Paint(LCP)の改善に重点を置いたパフォーマンス イニシアチブを開始しました。Monrif は、最もアクセス数の多い記事ページを特定し、それらのパスにプリレンダリングを適用することで、LCP を最大 17.9% 改善しました。これは、パフォーマンスとユーザー フレンドリーなニュース エクスペリエンスが大幅に改善されたことを意味します。さらに、ユーザー エンゲージメントも大幅に向上し、一部のセグメントでは 8.9% のピークを記録しました

事前レンダリングの成功に後押しされ、チームはバックフォワード キャッシュ(bfcache)のサポートも実装しました。これにより、リピーターが以前にアクセスしたページに戻る際に、ほぼ瞬時に読み込みが行われるようになり、シームレスでレスポンシブなブラウジング エクスペリエンスがさらに向上しました。

最初

ロールアウトの前に、内部テストと Chrome ユーザー エクスペリエンス レポート(CrUX)のデータから、Monrif の多くのページ(特に記事とホームページのビュー)で LCP スコアが最適ではないことがわかりました。

2025 年 3 月より前に最適化の取り組みが開始される前は、複数のタイトルのホームページ ビューの LCP の 75 パーセンタイルは 2.333 秒から 2.419 秒の範囲でした。技術的には「良好」のしきい値(2.5 秒以下)内でしたが、頻繁なナビゲーション パターンでのユーザーが認識するパフォーマンスを改善する余地はまだありました。

LCP を改善した方法

ナビゲーション中のレイテンシを短縮するため、Monrif は Speculation Rules API を使用して、すべてのデスクトップ ドメインとモバイル ドメインに投機的プリレンダリングを実装しました。この戦略は、パフォーマンスへの影響と技術的な安全性のバランスを取るように設計されており、リンク要素が特定のセレクタと条件に一致する場合にのみプリレンダリングを許可します。

{
  "prerender": [
    {
      "where": {
        "and": [
          {
            "not": {
              "selector_matches": "[rel~=nofollow]"
            }
          },
          {
            "not": {
              "selector_matches": ".no-prerender"
            }
          },
          {
            "selector_matches": "a"
          }
        ]
      },
      "eagerness": "moderate"
    }
  ]
}

(特定の除外を除き)すべてのリンクの積極性レベルが moderate に設定されました。この設定では、(パソコンでは)ホバー、(モバイルでは)ビューポートのヒューリスティックに基づいて推測します。このアプローチにより、チームはプリレンダリングの範囲を最も必要とされる可能性の高いリンクのみに制御し、リソースの使用量を最小限に抑えることができました。

結果

プリレンダリングの影響を評価するため、Google アナリティクス 4 のデータと CrUX 指標を使用して、Monrif の 3 つの主要な出版物(Il Resto del CarlinoIl GiornoLa Nazione)に焦点を当てて分析を行いました。

パソコンとモバイルの両方でプリレンダリングが有効になっていましたが、パソコンでは "moderate" により、ホバー時にすべての「もっと見る」リンクがスコープ内になるため、発生率が大幅に高くなりました。たとえば、La Nazione では、ウェブ(パソコン)ビューの 13.9% でプリレンダリングがトリガーされたのに対し、モバイルでは 2.9% にとどまりました。その結果、パフォーマンスの改善はデスクトップ プラットフォームでより顕著かつ一貫して見られるようになり、この調査の主な対象となりました。

2025 年 5 月下旬までに、CrUX のパソコンデータで確認できるように、3 つのパブリケーションすべてで LCP のパフォーマンスが大幅に改善されました。

出版物 LCP 2025 年 3 月 LCP 最小値(期間) LCP Jun 2025 最大限の改善
Il Resto del Carlino 2419 ミリ秒 1,986 ミリ秒(5 月 3 日~ 5 月 30 日) 1998 ミリ秒 −433 ミリ秒(−17.9%)
Il Giorno 2379 ミリ秒 1,972 ミリ秒(5 月 10 日~ 6 月 5 日) 2068 ミリ秒 −407 ミリ秒(−17.1%)
La Nazione 2333 ミリ秒 1,983 ミリ秒(5 月 3 日~ 5 月 30 日) 2140 ミリ秒 -350 ミリ秒(-15.0%)

これらの改善は、プリレンダリング アクティビティのピークとほぼ一致していました。次の表に、デスクトップの各サイトで、平均値からの増加率と量の両方で最も高いプリレンダリングの発生回数を示します。

出版物 最大プリレンダリング回数 最大プリレンダリング アクティビティ
Il Resto del Carlino 2025 年 5 月 22 日 平均より 39.5% 増加
Il Giorno 2025 年 6 月 5 日 平均より 36.3% 多い
La Nazione 2025 年 6 月 5 日 平均より 40.4% 増加

すべてのタイトルで、LCP 値が最も低かったのは、最も多いプリレンダリング イベントと大きく重複する期間(特に 2025 年 5 月中旬から 6 月上旬)でした。この同期性は、投機的プリレンダリングと実際のパフォーマンス向上との間に強い相関関係があることを示唆しています。

エンゲージメント効果

LCP の改善と並行して、Monrif はプリレンダリングのロールアウト中にユーザー エンゲージメントの顕著な増加を記録しました。Il Resto del CarlinoIl GiornoLa Nazione の GA4 のデータを分析した結果、プリレンダリングが最も活発だった週にエンゲージメント率が大幅に向上しました。

デスクトップでのプリレンダリングの強度、LCP の改善、エンゲージメントの向上間の相関関係の内訳は次のとおりです。

出版物 最大プリレンダリング アクティビティ LCP の最小範囲 エンゲージメントの上昇率*
Il Resto del Carlino 2025 年 5 月 22 日(+39.5%) 5 月 3 日~ 5 月 30 日 +8.9%
Il Giorno 2025 年 6 月 5 日(+36.3%) 5 月 10 日~ 6 月 5 日 +6.7%
La Nazione 2025 年 6 月 5 日(+40.4%) 5 月 3 日~ 5 月 30 日 +5.3%
*エンゲージメントの向上: 2025 年 3 月のベースライン(プリレンダリング前)と比較した、エンゲージメント セッション率(GA4 で定義)の相対的な改善率。

エンゲージメントには複数の要因が影響しますが、時間的な相関関係が強いことから、プリレンダリングによるパフォーマンスの向上は、より深い、より持続的なユーザー インタラクションにつながることが示唆されます。

広告への影響

Monrif の主な目標はユーザー エクスペリエンスとパフォーマンスの向上でしたが、この取り組みは広告指標にもプラスの効果をもたらしたようです。

特に、広告の視認性と広告枠の品質の重要な指標であるオープン マーケットの視認率は、プリレンダリングのロールアウト中にわずかながらも着実に改善されました。3 つのコア パブリケーション全体で、平均視認率は 1.03% 向上し、プリレンダリング アクティビティが最も活発だった週にほぼ一致しました。パフォーマンスとエンゲージメントの分析と同様に、これらの数値はデータセット全体で一貫性を確保するために、パソコンのトラフィックに焦点を当てています。

クリエイティブの読み込み時間が 0 ~ 500 ミリ秒の平均値(%)
ナビゲーションの種類 navigate prerender Delta
パソコン 76.1% 84.1% 10.4%
モバイル 66.6% 78.0% 17.1%

この改善は絶対値としては小さいものの、意味のあるものです。ビューアビリティがわずかに向上するだけでも、広告枠の品質が向上し、広告枠の充足率が上がり、広告主様の信頼度が高まります。

特に注目すべきは、パフォーマンスの向上にどのように関連しているかです。LCP を減らし、ナビゲーション速度を向上させることで、Monrif はページの読み込み時間を短縮し、ユーザーのエンゲージメントを高めることができました。これにより、広告がビューポートに表示される時間が長くなり、ユーザーに視認される可能性が高まります。

bfcache による高速ナビゲーションの改善

Monrif は、プリレンダリングと並行して、ブラウザのバックフォワード キャッシュ(bfcache)のサポートを有効にする取り組みも行いました。これは、ユーザーがブラウザの戻るボタンまたは進むボタンを使用して移動したときに、ページを瞬時に復元できるパフォーマンス メカニズムです。

bfcache との互換性を確保するため、デベロッパーはいくつかの一般的なブロッカーに対処しました。

  • unload イベント リスナーは信頼性が低く、まもなく非推奨となるため、削除しました。
  • unload イベント リスナー(特にサードパーティによる)の再導入を防ぐため、厳格な Permissions-Policy ヘッダーを採用しました。
  • pagehide イベント リスナーを実装して、接続(IndexedDB、WebSocket など)を安全に閉じられるようにしました。
  • Cache-Control: no-store は、多くの場合 bfcache をブロックする可能性があるため、厳密に必要でない限り使用を避けています。

チームは、プリレンダリングで使用したのと同じ統計的厳密さで bfcache の影響を分離するのに十分なデータをまだ取得していませんが、初期テストと Chrome DevTools のトレースにより、互換性のあるナビゲーションがメモリから完全に復元され、以前に閲覧した記事に戻る際の読み込み時間が 1 秒未満になることが確認されました。

まとめ

投機的プリレンダリングを統合したことで、Monrif はニュース ウェブサイトの LCP を大幅に改善し、読み込み時間を最大 17.9% 短縮しました。これらの機能強化により、体感パフォーマンスが向上しただけでなく、主要なタイトル全体でユーザー エンゲージメントが目に見えて向上しました。

また、このケースは、ユーザー中心のパフォーマンス最適化によって、広告の表示方法やタイミングに影響する条件が改善され、収益化のメリットが下流に波及する可能性を示唆しています。

このケーススタディでは、プリレンダリングなどの最新のナビゲーション最適化によって、コンテンツが豊富なプラットフォームでもウェブに関する主な指標を大規模に改善し、ユーザー エクスペリエンスとビジネス成果を測定可能な形で向上させることができることを示します。