# 遅いページロードのトラブルシューティング **Page loads** ダッシュボードの柔軟性、機能、および使いやすさは、ITプロフェッショナルが問題のある箇所を迅速に特定し、特定のアプリケーションページで問題を経験している可能性のある従業員に焦点を当てることを可能にします。 パフォーマンスしきい値を確認し、フィルタを設定することにより、ページの読み込みが遅くなる問題をトラブルシューティングします。 アプリケーションごとにしきい値を個別に設定することも、デフォルト設定を使用することもできます。 詳細については、[しきい値](/platform/ja/user-guide/applications/configuring-applications/configuring-web-applications/thresholds.md)のドキュメントを参照してください。 ページの読み込みが遅い原因のトラブルシューティングには、様々なアプローチがあります。 * 調査を開始するには、上部の**平均ページロード時間**メトリックや、その隣にある**バックエンド**、**デバイス & アプリネットワーク**、**クライアント**の各メトリックを評価してください。 これらのメトリックはデフォルトで、さまざまなページ間のすべてのナビゲーションを考慮したアプリケーションの全体的なパフォーマンスを示します。 * バックエンドの時間が長いことは、サーバーがリクエストの処理に時間を要していることを示しています。 これが、効率の悪いサーバーサイドコード、不適切なサーバーハードウェア、またはリソース集約型の操作が原因であることがあります。 長いバックエンド時間の問題に対処するには、アプリケーション開発者がコードを最適化するか、サーバーハードウェアをアップグレードする必要があるかもしれません。 水平方向のメトリックスを使用して、 XMLHttpRequests (XHRs) のリソースタイミングを確認できます。 計算時間が長い XHR はサーバーコールが遅いことを示しており、それに応じて最適化できます。 * 長いネットワーク時間は、ネットワーク渋滞、遅いインターネット接続、大きなファイルサイズ、またはサーバーとクライアント間の地理的距離などの問題を示す可能性があります。 これらの問題を解決するには、国、エンティティ、場所タイプ、ISP、アダプタタイプ、および最大のリソースごとにネットワーク時間を確認できます。 * 長いクライアント時間は、ページ要素のレンダリング遅延、過剰なJavaScript処理、効率の悪いCSSスタイリング、またはデバイス/ OSが他のタスクを処理していることを示す可能性があります。 これらの問題に対処するために、アプリケーション開発者は、HTTPリクエスト数を減らし、CSSおよびJavaScriptファイルのミニファイ、またはブラウザキャッシュの活用によってクライアントサイドコードを最適化する必要があるかもしれません。 * 次に、時間の経過とともにページのロード時間の変化を表示するタイムラインを使用して、最近のパフォーマンスの変更を巡回します。 このグラフで**バックエンド**、**デバイス & アプリネットワーク**、および**クライアント**のメトリックをトグルし、それらの時間経過を観察できます。 下の**従業員**チャートを使って、ページの読み込み時間パフォーマンスに対する高使用量または低使用量の影響を特定します。 * 時間フィルタを調整して、特にパフォーマンスが悪い期間に焦点を当てます。 チャートのズーム機能を使用するか、右上隅のタイムフレームピッカーを使用して実行できます。 * 次に、**重要なページとURL**の内訳を評価します。 現代のSaaSアプリケーションでは、異なるページがさまざまなパフォーマンス特性を持っています。 このセクションは、あなたの環境で最も不満の原因となるページを強調しています。 内訳には、追加のコンテキストを提供するための5つの列が含まれています。 他と比較して、**% フラストレーションページロード**が非常に高いページを探します。 * これらのページをクリックしてダッシュボードにフィルタを適用します。 ページ上部のグラフはそれに応じて更新されます。 次に、ページがバックエンド、ネットワーク、またはクライアントの問題で遅いかどうかを特定するための上記の手順を実行します。 * 十分に悪い体験に寄与する他の次元を特定するために、残りの内訳 (**デバイス**、**場所**、**組織**、および**技術**) を確認します。 データをブラウザー、オペレーティングシステム、場所、または他のオプションでフィルターします。 ジオロケーションの設定に関する詳細は、[ジオロケーションの設定](/platform/ja/user-guide/administration/system-configuration/product-configuration.md#productconfiguration-geolocationtab)ドキュメントを参照してください。 * ウィジェットの右上隅のアクションメニューオプションを使用して、「調査」モジュールでページの読み込みが遅いことの調査を続けることができます。 ## ウォーターフォールメトリクスを使用してページの遅い読み込みを診断する Webアプリケーションの詳細なトラブルシューティングには、ウォーターフォール分析メトリクスを使用してください。 これらのメトリックスは、パフォーマンスのボトルネックの正確な原因を特定し、エラーが発生しやすい要素を特定し、Webアプリケーション内のリソース集約型コンポーネントを強調するのに役立ちます。 ウォーターフォールメトリックスは、**リソース分析**タブの**Webアプリケーショントラブルシューティング**ライブラリダッシュボードで利用できます。
2024-05-27_13-32-42.png
詳細については、[Webアプリケーションの詳細なトラブルシューティング](https://docs.nexthink.com/library/web-application-advanced-troubleshooting)のドキュメントを参照してください。 ### Webリソースの新しいウォーターフォールメトリックスのリスト Nexthink エクスペリエンス ブラウザー拡張機能は、[Performance Resource Timing](https://developer.mozilla.org/ja/docs/Web/API/Performance_API/Resource_timing) API を使用してこれらのメトリックを収集します。 | 名前 | NQL 構文 | 説明 | | -------------------------------- | --------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | ナビゲーション中の最も長いリソース（名前、タイプ、サイズ、期間） |

•longest\_resource\_url

•longest\_resource\_type

•longest\_resource\_load\_time

•longest\_resource\_size

| **最も長いリソース**は、Webページのレンダリングに必要なすべての要素の中で、ロード時間が最も長かったリソースを指します。 特定のリソースが他よりも著しく長い時間を要する場合、それがWebアプリケーション全体のロードスピードに影響を与えている可能性があります。 | | ナビゲーション中の最大のリソース（名前、タイプ、サイズ、期間） |

•largest\_resource\_url

•largest\_resource\_type

•largest\_resource\_load\_time

•largest\_resource\_size

| **最も大きなリソース**は、Webページのロード中に完全にロードされるために最も大きなファイルサイズを持っていたリソースを指します。 ユーザーのブラウザが大きなリソースをダウンロードしてレンダリングする必要がある場合、遅延が増加し、ページのロード時間が長くなる可能性があります。 大きなリソースを分析することで、そのサイズを縮小するために最適化または圧縮する必要があるファイルを特定できます。 | | 問い合わせたドメインの数 | domains\_contacted |

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

これらのドメインには、アプリケーション自体のドメインの他に、分析スクリプト、広告、コンテンツ配信ネットワーク（CDN）などのサードパーティリソースのドメインが含まれます。

問い合わせる各ユニークドメインは、ブラウザがリソースを取得するための別個のサーバーを表しており、これが全体的なページロード時間に影響を及ぼす可能性があります。

| | リソースの数 | number\_of\_resources | **リソースの数**は、ナビゲーションイベント中にロードされたリソース—画像、スクリプト、スタイルシートまたは他のファイル—の総数を示します。 ウェブページに多くのリソースがあると、読み込みやブラウザでのレンダリングに時間がかかることがあります。 リソースの数を分析することで、Webアプリケーションのパフォーマンスを最適化する機会を特定できます。 たとえば、CSSおよびJavaScriptファイルの最小化または結合、画像の圧縮、キャッシング技術の使用を検討して、サーバーへのリクエスト数を減らすことができます。 | | 大きなリソースの数 | number\_of\_large\_resources | **大きなリソースの数**は、ナビゲーションイベント中に100KBを超えるリソース—画像、スクリプト、スタイルシートまたは他のファイル—の数を示します。 ユーザーのブラウザが大きなリソースをダウンロードしてレンダリングする必要がある場合、遅延が増加し、ページのロード時間が長くなる可能性があります。 大きなリソースを分析することで、そのサイズを縮小するために最適化または圧縮する必要があるファイルを特定できます。 | | リソースエラーの数 | number\_of\_resource\_errors | **リソースエラーの数**は、ナビゲーションイベント中にロードに失敗したか、エラーが発生したリソース—画像、スクリプト、スタイルシートまたは他のファイル—の数を示します。 リソースエラーは、特定のファイルまたはアセットがWebアプリケーションから欠落していることを示す可能性があります。 これにより、リンク切れ、画像の欠落、またはスクリプトが機能しない可能性があります。 | --- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://docs.nexthink.com/platform/ja/user-guide/applications/monitoring-applications/monitoring-web-applications/performance/page-loads/troubleshooting-slow-page-loads.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.