本文へスキップ

ユーザーアクションヒットマップ

ノート

機能改編のお知らせ

従来の ページロード分析 機能は、ユーザーアクション分析 に改編されました。 ページロードイベントだけでなく、クリックやタッチなど、さまざまなユーザーインタラクションを統合的に分析できるように機能が拡張されました。

ホーム画面 > プロジェクト選択 > 分析 > ユーザーアクションヒットマップ

ユーザーアクション イベントは、Webアプリケーションを訪れた最終ユーザーがページロードを完了するか、クリック、タッチなどのインタラクションを行ったときに発生します。 このイベントはヒットマップチャート形式で提供され、各イベントの詳細情報はタイムライン形式で確認できます。 これにより、Webページのパフォーマンス問題やユーザー体験を損なう要因を特定でき、以下のような情報が含まれます。

  • ページロードイベント

    • ページロードイベントの区間別詳細時間情報
    • ロードしたリソースの詳細
    • ブラウザエラーデータ
  • クリック/タッチイベント

    • クリック応答時間
    • クリック時にロードされたリソース情報
    • クリック時に発生したエラー情報

ユーザーアクションイベント一覧の確認

単一のユーザーアクションイベントごとに分析できます。 ユーザーアクションのパフォーマンスを分析するために、ヒットマップとさまざまな指標を提供します。

user-action-hitmap

  1. **ユーザーアクションヒットマップ **ウィジェットのチャート領域をドラッグしてください。

  2. ドラッグした領域のイベント一覧は、ユーザーアクションヒットマップ の下に ユーザーアクションリスト として表示され、ページグループごとに画面右側の ページグループ リスト で確認できます。

    • ユーザーアクションリストページURL で、目的のページリストを検索できます。

ユーザーアクションヒットマップ

ユーザーアクションヒットマップ ウィジェットは、時間経過に伴うユーザーアクションの応答時間を分布チャートとして表示します。 ウィジェットのチャート領域をドラッグしてください。 ドラッグした領域に該当するユーザーアクションの一覧が画面下部に表示されます。

  • 横軸はユーザーアクションイベントの終了時間です。

  • 縦軸はユーザーアクションイベントの経過時間(応答時間)です。

  • 水色紺色の順で、正常なユーザーアクションイベントの密度を表します。

  • 黄色オレンジの順で、エラーが発生したユーザーアクションイベントの密度を表します。 エラーのユーザーアクションイベントとは、イベント処理中にブラウザーエラーが発生した場合を指します。

ユーザーアクションリスト

ユーザーアクションヒットマップ でドラッグした領域に対応するユーザーアクションイベントが、ユーザーアクションリスト に表示されます。 リストの各項目の一番左にある 詳細表示アイコン アイコンをクリックすると、ユーザーアクション分析 の詳細画面が表示されます。

ユーザーアクションリスト には、次の基本情報が含まれます。

  • 開始時間:ユーザーアクションイベントの開始時刻

  • 経過時間:ユーザーアクションイベントの完了までにかかった時間

  • ページURL:ユーザーアクションが発生したページのURLパス

  • WEBブラウサ:エンドユーザーが使用したブラウザーの種類

  • デバイス:エンドユーザーが使用したデバイスの種類

  • OS:エンドユーザーが使用する機器のOSの種類

  • クライアントIP:エンドユーザーが使用するデバイスのIPアドレス

ノート

WhaTapは、クライアントに関する情報をデフォルトで保存します。

カラム情報の追加および修正

テーブルに他の情報カラムを追加したり、追加したカラムを非表示にすることもできます。 ユーザーアクション一覧 の右上にある カラムアイコン カラム設定 ボタンをクリックしてください。

ユーザーアクション一覧をフィルタリングする

ユーザーアクション一覧を対象に、検索語を入力して一致する項目をフィルタリングすることができます。 検索対象の項目を選択した後、検索語を入力して Enter キーを押すか、検索アイコン をクリックしてください。

  • ページURL
  • WEBブラウサ
  • デバイス
  • OS
  • クライアントIP
  • ユーザーID

ページグループ一覧をフィルタリングする

ページグループ一覧を対象にフィルタリングすることができます。 目的のページグループ一覧を選択してください。

ユーザーアクションイベントの詳細情報

ユーザーアクション一覧 の各項目の左側にある 詳細表示アイコン アイコンをクリックすると、ユーザーアクション分析 の詳細ウィンドウが表示されます。 詳細ウィンドウは、左側のイベント一覧と右側の詳細情報で構成されています。 ユーザーアクションのパフォーマンスを分析するために、さまざまな指標を提供し、パフォーマンスに影響を与える要因を特定できます。

イベントリスト

ユーザーアクション分析 の詳細ウィンドウの右側には、選択した時間範囲のユーザーアクションイベントが一覧で表示され、経過時間の順に並べ替えられます。 一覧で特定のイベントをクリックすると、右側のパネルにそのイベントの詳細情報が表示されます。

event-list

  • レスポンスタイム:ユーザーアクションの応答時間(ms)

  • ページURL:ユーザーアクションが発生したページのURL

  • ブラウザ:ユーザーが使用したブラウザの種類

  • デバイス:ユーザーが使用したデバイスの種類

  • オペレーティングシステム:ユーザーが使用したOS

詳細情報

ユーザーアクション分析の詳細ウィンドウの左側には、選択したイベントの詳細情報が表示され、概要、ユーザーセッション分析、セッションリプレイの各タブをクリックして確認できます。 情報は以下のように構成されています。

details-events

基本情報

  • ページURL:イベントが発生したページの完全なURL

  • ページタイトル:ウェブページのタイトル

  • ユーザーエージェント:ブラウザおよびオペレーティングシステムの詳細情報

  • ブラウザ/バージョン:ブラウザの種類とバージョン

  • オペレーティングシステム/バージョン:オペレーティングシステムの種類とバージョン

  • デバイス:使用している機器の種類(デスクトップ、モバイルなど)

  • 都市:ユーザーの接続位置

  • セッションID:ユーザーセッション識別子

  • クライアントIP:ユーザーのIPアドレス

  • 有効な接続タイプ:ネットワーク接続の種類(3G、4G、Wi-Fi など)

  • 有効な帯域幅:ネットワークの帯域幅情報

  • RTT:ラウンドトリップタイム(往復時間)

時刻情報

イベントの全体経過時間、開始時刻、終了時刻を確認できます。

区間ごとの所要時間(タイムラインチャート)

ページロード イベントでは、区間ごとの所要時間を視覚的に確認できます。

  • リダイレクト時間:ページリダイレクトに要した時間

  • リクエスト待機時間:サーバーの応答を待つ時間

  • ダウンロード時間:リソースのダウンロードに要した時間

  • Time to First Byte:最初のバイトを受信するまでの時間

  • Dom Interactive:DOMとのインタラクションが可能になる時点

  • Dom Content Loaded:DOMコンテンツの読み込み完了時間

  • Dom Complete:DOM処理完了時間

  • OnLoadイベント時間:ページのロード完了時間

  • キャッシュ時間:キャッシュされたリソースの検索時間

  • DNSルックアップ:ドメインの照会時間

  • TCP接続時間:TCP接続の確立に要する時間

リソース一覧

イベント処理の過程でロードされたリソースの詳細情報を提供します。 各リソースはタイムライン形式で表示され、読み込み順序と所要時間を一目で把握できます。

  • 名前:リソースのファイル名またはURL

  • 経過時間:各リソースの読み込み時間

resource-list

リソースの詳細情報

リソースリストで特定のリソースをクリックすると、そのリソースの詳細情報をツールチップで確認できます。 リソースの詳細情報を通じて、パフォーマンスのボトルネック区間を正確に把握し、最適化が必要なリソースを特定できます。

  • リソースタイミング情報

    • キャッシュ時間:キャッシュされたリソースの検索時間

    • DNSルックアップ:ドメインの照会に要した時間

    • 接続時間:サーバーとの接続確立に要した時間

    • リクエスト待機時間:サーバーの応答を待つ時間(TTFB)

    • ダウンロード時間:リソースのダウンロードに要した時間

    • 経過時間:リソース全体の読み込みに要した合計時間

  • リソース情報

    • タイプ:リソースの種類(css、js、image など)

    • サイズ:リソースファイルのサイズ

    • デリバリータイプ:転送方式(キャッシュ読み込みなど)

ブラウザーエラーを確認する

ブラウザエラーのデータを含むページロードイベントは、赤色で表示されます。 リソースリストからエラーが発生したステップを確認できます。

check-browser-error

ユーザーセッション分析

ユーザーセッションを基準にウェブページと相互作用しながら発生させたイベントやエラーなどを時間順に確認できます。 ユーザーセッション分析についての詳細は、次の文書を参照してください。

セッションリプレイ

ユーザーがウェブサイトで行うすべてのイベントを記録し、再生できる機能を提供します。 セッションリプレイ機能を通じて、クリック、スクロール、入力、ページ切り替えなどのユーザー行動を再現できます。 これにより、ユーザーが実際にウェブサイトとどのように相互作用するかを、正確に把握できます。

  • タイムラインの操作が可能なため、イベントをクリックすると、セッションリプレイのプレーヤーのタイムラインがそのイベントの時点に移動します。

  • 詳細アイコン 詳細アイコンをクリックすると、右側のドロワーにイベントの詳細情報が表示されます。

세션 리플레이

ノート

参考ドキュメント

  • エージェントオプションを通じて セッションリプレイ 機能を適用する方法については、次のドキュメントを参照してください。

  • セッションリプレイ 機能の使用に関する詳細は、次のドキュメントを参照してください。