ウェブパフォーマンスレポート

オンラインストアのパフォーマンスを最適化すると、お客様のショッピング体験を向上させ、ストアの見つけやすさを高め、コンバージョン率を上げることができます。ウェブパフォーマンスレポートは、Core Web Vitals と呼ばれる、読み込み速度、インタラクティブ性、視覚的な安定性に関する業界基準全体で、ストアのパフォーマンスを把握するのに役立ちます。

このレポートには、Core Web Vitals (読み込み速度、インタラクティブ性、視覚的な安定性) 全体でのストアフロントのパフォーマンスが表示されます。レポートには、デスクトップとモバイルでのエクスペリエンス、特定のパフォーマンスランク内でのエクスペリエンスの分布に関する情報が含まれ、アプリのインストール、テーマの更新、新しいコードなど、加えた変更がストアフロントエクスペリエンスにどのような影響を与えるかが表示されます。

追跡と計算のプロセスにより、このレポートのデータは最大 36 時間遅れる場合があります。

ウェブパフォーマンスの測定方法について詳しくはこちら。

ストアのウェブパフォーマンスデータを表示する

ストアのウェブパフォーマンスレポートを表示するには、[レポート] のスタッフ権限が必要です。リアルユーザー指標 (RUM) が入力されたダッシュボードを取得するには、オンラインストアのパスワード保護を解除する必要があります。

ウェブパフォーマンスの時系列レポートには、[テーマ] ページのパフォーマンス指標サマリーからアクセスできます。また、すべてのウェブパフォーマンスレポートには、Shopify 管理画面の [レポート] リストからアクセスできます。

パフォーマンス指標サマリーを表示する

パフォーマンス指標サマリーは、Shopify 管理画面の[テーマ] ページに表示され、ストアの 3 つの Core Web Vitals の時系列でのクイックサマリーを提供します。パフォーマンス指標サマリーについて詳しくはこちら。

手順:

  1. Shopify 管理画面から、[オンラインストア] > [テーマ] に移動します。

  2. 任意:カレンダーアイコン 日付ピッカーを使用して、選択した日付範囲のデータを表示します。[今日][過去7日間][過去30日間] の中から選択できます。

  3. 任意:パフォーマンス指標サマリーを使用してレポートにアクセスします。

ウェブパフォーマンスレポートを表示する

Shopify 管理画面の [レポート] リストには、複数のウェブパフォーマンスレポートが用意されています。これらのレポートは、設定パネルまたは ShopifyQL クエリエディタを使用してカスタマイズし、必要なデータを表示することができます。

Shopify レポートの使用について詳しくはこちら。

手順:

  1. Shopify 管理画面から、[分析] > [レポート] に移動します。

  2. [レポートを検索する] フィールドで、直接アクセスするレポートを検索します。

    • すべてのウェブパフォーマンスレポートを表示するには、コロン : を使用して検索します。
    • 最大コンテンツ表示に関するレポートを表示するには、キーワード contentful を使用して検索します。
    • Interaction to Next Paint に関するレポートを表示するには、キーワード next を使用して検索します。
    • Cumulative Layout Shift に関するレポートを表示するには、キーワード cumulative を使用して検索します。
  3. 開きたいレポートの名前をクリックします。

ウェブパフォーマンス指標サマリー

ウェブパフォーマンス指標サマリーでは、過去 30 日間の実際のユーザーデータに基づいて、オンラインストアのパフォーマンスに関するインサイトが得られます。3 つの Core Web Vitals に対してストアが評価され、各指標に[良好][改善が必要]、または[低い] のいずれかのランクが割り当てられます。このランクは、上位 75% のユーザーエクスペリエンスを反映しています。

パフォーマンス指標サマリーの例。ダッシュボード、サンプルデータ、ランクが表示されています。

ウェブパフォーマンス指標サマリーには、以下の情報が含まれています。

  • ストアの最大コンテンツ表示 (LCP) のランク。これは、画面上の最大の要素がどれだけ速く表示されるかに基づいて、読み込み速度を測定します。
  • ストアの Interaction to Next Paint (INP) のランク。これは、リンクやボタンのクリックなど、ユーザーのインタラクション後に、ブラウザが次のフレームを描画したり、画面に変更を表示したりするまでにかかる時間に基づいて、インタラクティブ性を測定します。
  • ストアの Cumulative Layout Shift (CLS) のランク。これは、ページ内を移動するときにコンテンツが予期せずどのくらい移動するかに基づいて、視覚的な安定性を測定します。
  • ストアのオンライン訪問者のセッション (デバイスタイプ別に分類)。

ウェブパフォーマンス指標サマリーの 3 つの Core Web Vitals で利用できるランクは、以下のとおりです。

3 つの Core Web Vitals の目標指標とその説明を一覧にした表です。
Core Web Vitalランク目標指標説明
最大コンテンツ表示 (LCP)良好2500 ミリ秒以下ほとんどのユーザーは、ページの読み込みが速いと感じています。
改善が必要2500 ミリ秒を超え、4000 ミリ秒未満一部のユーザーはページの読み込みが速いと感じていますが、改善の余地があります。
低い4000 ms を超えるほとんどのユーザーにとってページの読み込みが遅くなっています。改善が必要です。
Interaction to Next Paint (INP)良好200 ms 以下ほとんどのユーザーにとってページの応答性は良好です。
改善が必要200 ms を超え 500 ms 未満一部のユーザーにとってページの応答性は良好ですが、改善の余地があります。
低い500 ms を超えるほとんどのユーザーにとってページの応答性が遅くなっています。これはユーザーにストレスを与え、改善が必要です。
Cumulative Layout Shift (CLS)良好0.1 以下ページの読み込み中、ほとんどのユーザーにとってレイアウトは安定しています。
改善が必要0.1 を超え 0.25 未満ページの読み込み中、一部のユーザーにとってレイアウトは安定していますが、改善の余地があります。
低い0.25 以上ページの読み込み中、ほとんどのユーザーにとってレイアウトが不安定になっています。これはユーザーを苛立たせる可能性があり、改善が必要です。

いずれかの指標の評価が [中程度] または [低い] 場合は、ウェブパフォーマンスレポートを使用して問題の原因を特定し、解決するための措置を講じることを検討してください。

ウェブパフォーマンスの時系列レポート

3 つのコアウェブバイタルについて、サイトのウェブパフォーマンスの時系列を ウェブパフォーマンスレポートで確認できます。

デフォルトでは、関連するコアウェブバイタルの 75 パーセンタイル値のデータがミリ秒単位で表示されますが、レポートの 設定パネルを使用して、ニーズに合わせてレポートをカスタマイズできます。また、期間、日付のグループ化、デバイスタイプなど、さまざまな [ディメンション][フィルター] を調整して、サイトのトラフィックを最適に反映させることもできます。レポートのカスタマイズについての詳細をご確認ください。

折れ線グラフのビジュアライゼーションには、アプリのインストール、テーマの更新、新しいコードなど、オンラインストアに加えられた変更が、時間の経過とともにコアウェブバイタルにどのように影響したかが表示されます。このビジュアライゼーションには、以下の追加要素が含まれています。

  • 選択した期間に基づいた、ウェブパフォーマンスの [サマリー] スコア。
  • イベントアノテーションタグはグラフ内に番号付きの垂直線で表示され、カーソルを合わせると、ウェブパフォーマンスに影響を与えた可能性のあるストアの変更に関する詳細情報を確認できます。
  • ウェブパフォーマンススコアのしきい値は、グラフを横切る水平線で表され、[良好][中程度][低い] の各結果の間のしきい値を示します。

データテーブルにある分布指標の列の棒グラフには、パフォーマンスのカテゴリー (良好 (緑)、中程度 (黄色)、低い (赤)) ごとに、該当するページセッション数が表示されます。

ページ URL 別のウェブパフォーマンスレポート

3 つのコアウェブバイタルについて、サイトのウェブパフォーマンスを個々のページ URL ごとに ウェブパフォーマンスレポートで確認できます。

デフォルトでは、関連するコアウェブバイタルの 75 パーセンタイル値のイベントデータがミリ秒単位で表示されますが、レポートの 設定パネルを使用して、ニーズに合わせてレポートをカスタマイズできます。また、期間、日付のグループ化、デバイスタイプなど、さまざまな [ディメンション][フィルター] を調整して、サイトのトラフィックを最適に反映させることもできます。レポートのカスタマイズについての詳細をご確認ください。

これらのレポートには、グラフによるビジュアライゼーションは含まれていません。データテーブルのみが表示されます。デフォルトでは、テーブルのプライマリーディメンションは [ページパス] です。分布指標の列の棒グラフには、パフォーマンスのカテゴリー (良好 (緑)、中程度 (黄色)、低い (赤)) ごとに、該当するページセッション数が表示されます。

ページタイプ別のウェブパフォーマンスレポート

3 つのコアウェブバイタルについて、サイトのウェブパフォーマンスをページタイプ別に ウェブパフォーマンスレポートで確認できます。

デフォルトでは、関連するコアウェブバイタルの 75 パーセンタイル値のデータがミリ秒単位で表示されますが、レポートの 設定パネルを使用して、ニーズに合わせてレポートをカスタマイズできます。また、期間、日付のグループ化、デバイスタイプなど、さまざまな [ディメンション][フィルター] を調整して、サイトのトラフィックを最適に反映させることもできます。レポートのカスタマイズについての詳細をご確認ください。

これらのレポートには、グラフによるビジュアライゼーションは含まれていません。データテーブルのみが表示されます。デフォルトでは、テーブルのプライマリーディメンションは [ページタイプ] です。分布指標の列の棒グラフには、パフォーマンスのカテゴリー (良好 (緑)、中程度 (黄色)、低い (赤)) ごとに、該当するページセッション数が表示されます。

ウェブパフォーマンスレポートの使用

ウェブパフォーマンス指標のサマリーに、コアウェブバイタルのスコアを表示するための十分なデータが蓄積されたら、パフォーマンスレポートを使用して、ウェブパフォーマンススコアに影響を与えている可能性のある潜在的な問題を絞り込むことができます。ウェブパフォーマンスに影響を与えている可能性のあるページや要素を特定したら、ストアのどこを、どのように最適化するかについて、情報に基づいた決定を下すことができます。

お客様のデバイス、ネットワーク、ロケーションなど、管理できない特定の要因があることに留意してください。世界中のお客様が、さまざまなデバイスやインターネット接続を使用してストアにアクセスするため、これらの要因によってストアの読み込みが速くなったり遅くなったりする場合があります。全体の指標が良好である限り、一部の日付やページが中程度または低いカテゴリーに分類されても、あまり心配する必要はありません。

ウェブパフォーマンスを最適化する機会を調査するには、以下の一般的な手順に従ってください。

  1. パフォーマンス指標のサマリーを確認し、どのコアウェブバイタルスコアに最適化が必要となりうるかの概要を把握します。
  2. 特定のコアウェブバイタルについて、関連する 3 つのレポートを使用して、ストアのデータをさらにドリルダウンします。
    • [時系列] レポートを使用して、特定のスコアへの影響がいつ発生した可能性があるかを調査します。
    • Page Type レポートでは、特定の ページテンプレート がウェブパフォーマンスに影響を及ぼしているかどうかを調査できます。
    • [ページ URL] レポートを使用して、特定のページがウェブパフォーマンスへの影響を示しているかどうかを調査します。
  3. ウェブパフォーマンスに影響を与えている期間、ページ、要素を特定することで、問題の具体的な原因をより確信を持って把握し、コアウェブバイタルスコアの改善を進めることができます。

オンラインストアのパフォーマンスを改善する方法については、オンラインストアのパフォーマンスを改善するを参照してください。