当社のブラウザー モニタリングAJAX UI は、ブラウザーから HTTP や HTTPS ドメインなどの外部エンドポイントへの最近の AJAX リクエストを表示します。この情報は、サイトの Web ページの一部を更新する AJAX 呼び出しに時間がかかる場合や失敗する場合に、エンド ユーザー エクスペリエンスの問題を特定するのに役立ちます。デスクトップ ブラウザー、モバイル デバイス、タブレットなど、デバイスの種類別に問題を確認できます。
トラブルシューティングのポイント
ここでは、アプリのパフォーマンス問題を特定するためのトラブルシューティングのヒントをご紹介します。
AJAXコールのトラブルシューティング | 例 |
|---|
リクエスト全体の問題 | どこに問題があるのかわからない場合や、リクエストを最初から最後までトレースしたい場合は、 AJAX UI の distributed tracing リンクをクリックしてください。 |
タイミングの問題 | Total time percentages, throughput requests per minute (rpm), and average data transfer rates per requestは、タイミングの問題を特定するのに役立ちます。 - AJAX サマリーページの Average data transfer per request チャートで大きなスパイクを探してください。
- Group By [グループ化]ドロップダウンを使用してデータの傾向を分析し、リクエスト URL、GraphQL 操作名、およびその他の多くのフィールドごとに AJAX パフォーマンスを評価します。
- 個々のコールの AJAX performance タブから、高いコールバック時間値とデータ転送速度の相関関係を調べます。
|
エンドポイントの問題 | 異常なエンドポイントを探し、そこからの個々のリクエストを調査します。 AJAXサマリーページのステータスコードチャートは、コールからのリターン動作に関する情報を提供します。 200の範囲外のステータスコードが多数表示される場合は、AJAXエンドポイントに問題があることを示している可能性があります。 |
具体的なWebページの位置の問題 | 潜在的なAJAXの問題を、それらがロードされるページのコンテキスト内で調べる。AJAXトランザクションを選択し、 Session traces with AJAX のテーブルから任意のトレースを選択します。 |
設定方法
アプリのAJAXリクエストに関する問題をトラブルシューティングするためのものです。
- one.newrelic.com >All capabilities > Browser > (アプリを選択) > AJAXに移動します。
- デバイスのタイプを選択します：デスクトップ（デフォルト）、モバイル、およびタブレット。
- AJAX リクエストをクリックします。
Ajax リクエストに照準を合わせたら、調査を開始します。これらの戦略のいくつかを試してください。
サマリーページには、AJAXコールのトラブルシューティングに役立ついくつかのチャートが用意されています。
AJAXによる要約ページ | コメントコメント |
|---|
グループとフィルター | UIで使用可能な並べ替えオプションのいずれかを使用します。 2分以上かかるすべてのAJAXリクエストは自動的に除外されます | Group by[グループ化] オプションを使用して requestUrl または groupedRequestUrl を選択すると、データをより柔軟に表示できます。 |
エンドポイント | Throughput チャートには、スループットが最も高い5つのエンドポイントが表示されます。コールに5つ以上のエンドポイントがある場合は、 Other としてチャートに統合されます。 |
New Relicからの呼び出し | お客様のアプリへのAJAXコールを当社のブラウザが監視しているのが見えるかもしれません。これは正常なことです。なぜなら、すべてのアクティビティはブラウザのセッション中にキャプチャされるからです。 |
欠落しているブラウザデータ | AJAXのタイミングの詳細は、IE 7、IE 8、Chrome for iOSのブラウザでは確認できません。他のブラウザで期待通りのデータが表示されない場合は、 AJAXのトラブルシューティング手順 に従ってください。 |
AJAXサマリーページから特定のコールを選択した後、 AJAXパフォーマンスリンクを使用して詳細情報にドリルダウンできます。これには、 セッショントレースの詳細への直接リンクが含まれます。
ここからタブを選択して、ページ ビュー別のパフォーマンス データを取得することもできます。(アプリ サーバーのリクエスト数がブラウザの PageView トランザクション数を大幅に上回っている場合は、バックエンドへのリクエストの一部が AJAX を介して行われているためです。詳細については、 トラブルシューティング手順を参照してください。)
one.newrelic.com >All capabilities > Browser > (アプリを選択) > AJAX > (AJAX 呼び出しを選択): この例は、特定の AJAX 呼び出しのパフォーマンスの詳細を示します。ページビューごとにパフォーマンスの詳細を表示することもできます。
平均応答時間 チャート上のAJAXエンドポイントは、4つの時間帯として表示される場合と2つの時間帯として表示される場合があります。これは、 クロスアプリケーショントレースヘッダー があるかどうかによります。
4 つの期間 (アプリケーション時間、 キュー時間、 ネットワーク時間、および コールバック時間): これらの AJAX 呼び出しは、監視対象のアプリに対して行われます。
クロス アプリケーション トレース ヘッダーを提供するエージェント。
2つの時間帯（応答時間 と コールバック時間 ）があります。これらのAJAXコールは、APMエージェントが監視していないアプリに対して行われているか、クロスアプリケーショントレースヘッダーを提供していないエージェントによって監視されているかのどちらかです。
リクエストの最初から最後までをトレースするには、 AJAX UIのdistributed tracing リンクをクリックすることもできます。
- 配布されたトレースのリストを表示するには、 AJAX UIのAJAXサマリーレベルにあるリンクをクリックします。
- アプリケーションと特定のリクエストタイプによってフィルタリングされたすべてのトレースを表示するには、 AJAX UIで選択したリクエストの分散トレースリンクをクリックします。
AJAXカテゴリリストを Total time percentage でソートすると、リストには各AJAXカテゴリのパーセンテージが表示されます。また、チャートには時間のパーセンテージが最も高いリクエストが表示されます。
この情報を表示するために、ブラウザは各AJAXカテゴリの累積リクエスト時間を取得し、それをすべてのAJAXリクエストの累積リクエスト時間で割ります。スループットの高いリクエストは、スループットの低いリクエストよりも優先されるため、レスポンスタイムを最適化する場所を特定するのに役立ちます。
例2つのAJAXカテゴリのタイムパーセンテージの計算
この例では、 api1.example.comとapi2.example.comの2つのAJAXカテゴリを使用しています。
api1.example.comは1回ヒットし、応答するのに1秒（1000ms）かかります（1 x1秒=1秒）。
api2.example.comは500回ヒットし、応答するのに1ミリ秒かかります（500 x1ミリ秒=500ミリ秒、つまり0.5秒）。
すべてのAJAXカテゴリの累積リクエスト時間は1500ms、または1.5秒です。時間のパーセンテージを得るためには、各AJAXカテゴリを累積リクエスト時間で割り、パーセンテージのために100を掛けてください。
したがって、 api1.example.comは合計時間パーセンテージの67％（1000を1500で割ったものに100を掛けたもの）であり、 api2.example.comは33％（500を1500で割ったものに100を掛けたもの）です。
時間計算 | api1 | api2 |
|---|
ヒット数 | 1 | 500 |
対応時期 | 1秒（1000ms） 1ヒット×1000ms＝1000ms(1秒) | 1ミリ秒（1ms） 500ヒット×1ms＝500ms（0.5秒） |
すべてのAJAXカテゴリの累積リクエスト時間 | 1000ms + 500ms = 1500ms (1.5秒) | 1000ms + 500ms = 1500ms (1.5秒) |
Time percentage = Category / 1500ms cumulative request time x 100 for percentage | 1000ms / 1500 x 100 = 67%となります。 | 500ms / 1500 x 100 = 33 |
次のステップ
AJAX UIに加えて、これらのリソースも利用できます。