ページロードの遅延のトラブルシュート

ページ読み込み ダッシュボードの柔軟性、機能、使いやすさにより、ITプロフェッショナルは問題のある領域を迅速に特定し、特定のアプリケーションページで問題が発生している可能性のある従業員に注力できます。

パフォーマンス閾値を確認し、フィルターを設定することで、ページ読み込みの遅延をトラブルシューティングします。 各アプリケーションの閾値は個別に設定するか、デフォルト設定を使用できます。 詳細は閾値ドキュメントを参照してください。

ページ読み込みの遅延のトラブルシューティングには様々なアプローチがあります。

  • 最初に、上部の 平均ページ読み込み時間 指標を評価し、隣接する バックエンドデバイスとアプリネットワーク、および クライアント 指標も評価してください。 デフォルトでは、これらの指標は異なるページでのすべてのナビゲーションを考慮したアプリケーションの総合的なパフォーマンスを表示します。

    • 長いバックエンド時間は、サーバーがリクエストを処理するのに時間を費やしていることを示します。 これは非効率なサーバーサイドコード、サーバーハードウェアの不足、またはリソース集約的な操作が原因である可能性があります。 バックエンド時間の長い問題に対処するには、アプリケーション開発者がコードの最適化やサーバーハードウェアのアップグレードを行う必要があるかもしれません。 ウォーターフォールメトリクス を使用して、XMLHttpRequests (XHRs) のリソースタイミングを確認できます。 拡張された計算時間を持つXHRは、サーバーの呼び出しが遅れていることを示し、適切に最適化できます。

    • 長いネットワーク時間は、ネットワークの混雑、遅いインターネット接続、大きなファイルサイズ、またはサーバーとクライアントの間の地理的距離などの問題を示すことがあります。 これらの問題を特定するために、国、エンティティ、場所の種類、ISP、アダプタータイプ、および最大のリソースごとにネットワーク時間を確認できます。

    • 長いクライアント時間は、ページ要素のレンダリングの遅さ、過剰なJavaScript処理、非効率的なCSSスタイリング、またはデバイス/OSが他のタスクを処理していることなどの問題を示すことがあります。 これらの問題に対処するためには、アプリケーション開発者がクライアントサイドのコードを、HTTPリクエストの数を削減し、CSSとJavaScriptファイルをミニファイして、またはブラウザのキャッシングを活用して最適化する必要があるかもしれません。

  • 次に、パフォーマンスの最近の変化を、ページ読み込み時間を時間の経過とともに表示するタイムラインを使って見つけます。 このチャートで バックエンドデバイスとアプリネットワーク、および クライアント 指標をトグルして、それらの時間経過に伴う進化を観察できます。 下の 従業員 チャートを使って、ページ読み込み時間のパフォーマンスへの高使用量や低使用量の影響を特定します。

  • 例外的に悪いパフォーマンスの期間に注力するために、時間フィルターを調整します。 これは、チャートのズーム機能を使用するか、右上角の時間フレームピッカーを使用して行うことができます。

  • それから、主要ページとURLの内訳を評価できます。 異なるページが、現代のSaaSアプリケーションでは異なるパフォーマンス特性を持っています。 このセクションは、あなたの環境で最もフラストレーションを引き起こすページを強調します。 内訳には、追加のコンテキストを提供する5つの列が含まれています。 他のページと比べて特に高い フラストレーションページ読み込み % を持つページを探します。

  • これらのページをクリックして、ダッシュボードにフィルターを適用します。 ページの上部にあるグラフは、それに応じて更新されます。 次に、ページがバックエンド、ネットワーク、またはクライアントの問題で遅いかどうかを特定するために上記のステップを踏んでください。

  • その他の非常に悪い体験に寄与する次元を特定するために、残りの内訳(デバイス場所組織技術)を確認してください。 ブラウザ、オペレーティングシステム、位置、または他のオプションでデータをフィルタリングします。 ジオロケーションの設定についての詳細はジオロケーション設定ドキュメントを参照してください。

  • ウィジェットの右上角にあるアクションメニューオプションを使用することで、調査モジュール内でページ読み込みの遅延に関する調査を続けることができます。

ページ読み込みの遅延を診断するウォーターフォールメトリクス

ウェブアプリケーションを詳細にトラブルシューティングするには、ウォーターフォール解析メトリクスを使用してください。 これらのメトリクスは、パフォーマンスのボトルネックの正確な原因を特定し、エラーが発生しやすい要素を特定し、ウェブアプリケーション内のリソース集約的なコンポーネントをハイライトするのに役立ちます。 ウォーターフォールメトリクスは、 リソース分析タブの ウェブアプリケーショントラブルシューティング ライブラリダッシュボードで利用可能です。

2024-05-27_13-32-42.png

詳細はウェブアプリケーション詳細トラブルシューティングドキュメントを参照してください。

ウェブリソース用の新しいウォーターフォールメトリクスのリスト

Nexthink Application Experience ブラウザー拡張機能は、Performance Resource Timing APIを使用してこれらのメトリクスを収集します。

名前
NQL 構文
説明

ナビゲーション中の最長リソース(名前、タイプ、サイズ、時間)

最長のリソース は、ウェブページのレンダリングに必要なすべての要素の中で対最も長い読み込み時間を持っていたリソースを指します。

最長リソース」は、ウェブページのレンダリングに必要なすべての要素の中で最も長い読み込み時間を経験したリソースを指します。 特定のリソースが他のものと比べて著しく長い時間をかけて読み込まれる場合、それはwebアプリケーションの全体的な読み込み速度に影響している可能性があります。

ナビゲーション中の最大のリソース(名前、タイプ、サイズ、時間)

ユーザーのブラウザが大きなリソースをダウンロードしてレンダリングする必要がある場合、それは遅延の増加とページ読み込み時間の遅延に繋がります。

大きなリソースを分析することで、ファイルを最適化または圧縮してサイズを縮小する機会を特定できます。 ユーザーのブラウザが大規模なリソースをダウンロードしてレンダリングする必要がある場合、待機時間が増加しページの読み込み時間が遅くなる可能性があります。 大規模なリソースを分析することは、ファイルのサイズを縮小するために最適化または圧縮する必要があるファイルを特定するのに役立ちます。

問い合わせたドメイン数

問い合わせたドメインの数は、様々なリソース(画像、スクリプト、スタイルシート、フォント、その他)が取得されている一意のドメイン名の数を示します。

これらのドメインは、アプリケーション自身のドメインや、分析スクリプト、広告、コンテンツデリバリーネットワーク〈CDN〉などのサードパーティリソースのドメインを含むことができます。ブラウザが資源を取得するために各独立したドメインと接触する必要があり、これが全体的なページ読み込み時間に影響を与える可能性があります。

それぞれのユニークなドメインへのアクセスは、ブラウザがリソースを取得する必要がある別のサーバーを表し、全体的なページの読み込み時間に影響を与える可能性があります。

資源数

資源の数は、ナビゲーションイベント中に読み込まれる資源(画像、スクリプト、スタイルシート、またはその他のファイル)の総数を示します。

ウェブページにある資源の数が多ければ多いほど、ブラウザで読み込んでレンダリングするのに時間がかかる可能性があります。 数を分析することで、ウェブアプリケーションの性能を最適化する機会を特定できます。 たとえば、CSSとJavaScriptファイルを最小限に抑えたり結合したり、画像を圧縮したりすること、またはサーバーへのリクエスト回数を減らすためにキャッシング技術を使用することを考慮できます。 例えば、CSSとJavaScriptファイルを最小化または結合、画像を圧縮するか、キャッシング技術を使用してサーバーへのリクエストの数を減少させることを検討するかもしれません。

大きな資源の数

ナビゲーションイベント中に100KBを超える大きさの資源(画像、スクリプト、スタイルシート、またはその他のファイル)の数を示します。

ユーザーのブラウザが大きな資源をダウンロードしてレンダリングする必要がある場合、それは遅延の増加とページ読み込み時間の遅延に繋がります。 大きな資源を分析することで、ファイルを最適化または圧縮してそのサイズを減らす機会を特定できます。 リソースエラー数

ナビゲーションイベント中に読み込みが失敗したりエラーが発生したりした資源(画像、スクリプト、スタイルシート、またはその他のファイル)の数を示します。

資源エラーは、ウェブアプリケーションから特定のファイルやアセットが欠落していることを示すことがあります。

これにより、リンク切れ、画像が表示されない、または非機能スクリプトが発生する可能性があります。 リソースエラーは、ウェブアプリケーションからファイルやアセットが欠如していることを示している可能性があります。 これにより、リンクが途切れたり、画像が欠如する、スクリプトが機能しないといった問題が発生する可能性があります。

Last updated

Was this helpful?