SPA2 の場合、javascript エージェントが spa を自動インストゥルメントできるようにするために、フラグを設定する必要があります。SPA2 自動インストゥルメンテーションが有効になっている場合、JavaScript エージェントは次の処理を実行します。

  • 仮想ページの検出

  • 仮想ページのエンドツーエンドの時間の測定

  • リソース、JavaScript エラー、および Ajax 要求の相関

  • 仮想ページの命名

SPA2 モニタリングを有効にする場合は、「SPA2 モニタリングの設定」を参照してください。

SPA2 モニタリングのしくみ

次の図は、JavaScript エージェントがエンドユーザ応答時間(EURT)メトリックの開始点と終了点を定義し、Ajax 要求、リソース、および JavaScript エラーに関連付けられる方法を示しています。

SPA Monitoring Diagram

ステップブラウザのアクティビティJavaScript エージェントのアクション

ユーザは SPA のベースページに移動します。HTML スケルトン、コア CSS、および JavaScript がブラウザにロードされます。 

Javascript エージェントは、ベースページのビーコンを送信します。

ベースページから、ユーザはボタンをクリックして製品を表示します。仮想ページは、以前にダウンロードしたコンテンツと Ajax 要求を通じて取得した新しいコンテンツを組み合わせてロードされるため、URL が変わります。

JavaScript は、仮想ページの開始時刻としてユーザアクションをマークします。

ユーザアクションとブラウザアクティビティは 5 秒間停止します。ブラウザのアクティビティには、リソース要求や Ajax コールの発信などが含まれます。

JavaScript エージェントまたは JavaScript API を使用するコードは、URL の変更後にブラウザアクティビティが最後に確認された時点の仮想ページの終了時刻をマークします。次に、JavaScript エージェントが仮想ページのビーコンを送信します。ただし、仮想ページのロードが 1 つの低速アクティビティで停止した場合、JavaScript エージェントは仮想ページの終了をマーキングする前に 8 秒間待機します。

仮想ページのロード中に発生した Ajax 要求、リソースロード、JavaScript エラーなどのアクティビティは、その仮想ページに関連付けられます。

一部のブラウザアクティビティは JavaScript にアクセスできません。たとえば、DOM の更新後、ブラウザが画面に DOM を表示する時間です。そのため、仮想ページがリソースを要求しない場合は、非常に高速な EURT(10 ミリ秒未満)が表示されることがあります。

SPA2 メトリック

ブラウザ RUM は、ベースページ、Ajaxe 要求、および仮想ページのメトリックを異なる方法で計算します。次の図は、エンドユーザから見たベースページと仮想ページのメトリックの違いを示しています。メトリックの定義については、「ブラウザ RUM メトリック」を参照してください。

ベースページの場合、ブラウザ RUM はエンドユーザ応答時間(EURT)、視覚的な完了時刻(VCT)、およびページ完了時間(PCT)を計算します。仮想ページの場合、ブラウザ RUM は EURT と VCT を計算します。

エンドユーザ応答時間

エンドユーザ応答時間(EURT)は、すべてのコンテンツ(ビジュアルおよび非ビジュアル)がページにロードされる合計時間を計算します。 

End User Response Time base Page Diagram
End User Response Time Virtual Page Diagram

視覚的な完了時間

視覚的な完了時間(VCT)は、ブラウザがビューポイント内のすべてのビジュアルコンテンツのロードを完了した時点を計算します。

Visually Complete Time Base Page Diagram
Visually Complete Time Virtual Page Diagram

ページ完了時間

ページ完了時間(PCT)はベースページの SPA2 メトリックのみです。PCT は、コンテンツがビューポイントの内外にあるかどうかに関係なく、ブラウザがページ上のすべてのビジュアルコンテンツのロードを完了した時点を計算します。

Page Complete Time Diagram