ウェブページの読み込み時間が長く、レンダリングの問題をトラブルシューティングする

問題

ウェブアプリケーションは、そのアクセスの容易さ、柔軟性、便利さから、現在最も広く使用されているアプリケーションの一つです。 インターネット接続を備えた全てのデバイスからアクセスでき、デスクトップコンピュータ、ノートパソコン、タブレット、スマートフォンを含み、移動中やリモート作業を行うユーザーに理想的です。

ウェブページのレンダリングの問題は、ページの読み込みが遅い、不完全な読み込み、またはページがまったく読み込まれないなど、さまざまな問題を引き起こす可能性があります。 ユーザーがウェブアプリケーションにシームレスにアクセスできるようにするためには、レンダリングの問題をすばやくトラブルシューティングし、解決することが不可欠です。 この記事では、ウェブページのレンダリング問題の一般的な原因と、それをさらに分離するためのトラブルシューティング手順について説明します。

考えられる原因 

ウェブページがレンダリングに失敗したりレンダリングが非常に遅い理由は多数あります。 一般的なもののいくつかは次のとおりです:

  • サーバーへのサブ最適ルーティングパス
  • 破損した/古いブラウザキャッシュとクッキー
  • サーバーの問題
  • 壊れたリンクまたは不足しているリソース
  • 広告ブロッカーまたはファイアウォールによるコンテンツのブロック

トラブルシューティング 

サーバーへのサブ最適ルーティングパス

ウェブサーバーへのサブ最適ルートが原因で、時にはページの読み込みが遅くなることがあります。 サイトとサーバー間の最適なルートを確保するために、以下の簡単な方法を用いて、レイテンシーを検証することができます。 pingテストまたはトレースルートを実行することによって、接続がカトを通過したときに得られる結果と、カトを完全にバイパスしたときに得られる結果を比較できます。

1。 Ping  ウェブサーバーが応答しているかどうかを確認するためにpingコマンドを使用できます。 サーバーにアクセス可能な場合、サーバーからの応答とラウンドトリップタイム(RTT)を受け取ります。 RTTの値がCatoを通して接続する場合に高い場合、さらなるトラブルシューティングのためにCatoを通る高いレイテンシーを参照してください。

pingresponse.jpg

2。 トレースルート  接続が宛先までの経路を確認するためにトレースルートコマンドを使用できます。 トレースルートに表示されるホップの数は、接続速度を決定するための決定的な要素ではありません。 その代わりに、ラウンドトリップタイム(RTT)が接続速度を評価する際に重要な役割を果たします。

次の例はこのシナリオを強調しています:接続がCatoを通じて行われた際、ネットワーク経路上のホップの数が大幅に減少するにもかかわらず、ラウンドトリップタイム(RTT)は接続がバイパスされた場合の結果と比較して予想外に高くなっています。

以下の接続はCatoをバイパスしました:

traceroute.jpg

以下は同じ接続を示していますが、Catoを通過しています:

traceroute1.jpg

注意: Catoクラウドを通過する際、通常はホップ数の減少が見られます。 これはCatoクラウドのインフラストラクチャ内での内部ホップがトレースルートの結果に反映されないためです。

Catoを通過する際の高レイテンシー:

接続がCatoを通過する場合の高レイテンシーに対処するために、以下の設定を確認することが重要です:

ソケットが最も近いPoPに接続していることを確認

  • CMAで、モニタリングタブに移動し、影響を受けたサイトを選択します
  • 右側のペインで、最近の接続の下、ログを表示をクリックします。 それにより、接続されたPoPに関する情報を含む別のペインが開きます。connectedPoP.jpg
  • サイトの場所に最も近いPoPに接続されていない場合、ネットワーク > サイト > サイトの設定 > 一般 > 優先PoPロケーションに移動して、ソケットが優先PoPに接続するよう手動で設定されているかどうかを確認してください
  • 誤って間違ったPoPに設定されていた場合、このサイトの優先PoPを定義するの手順に従って、最も近いPoPに設定するか、プライマリロケーションを自動 (デフォルト) に設定すると、ソケットは最適なPoPを自動的に選択して接続します。

出力またはバックホールのルールを確認

  • CMAで、ネットワークルールに移動し、該当のウェブサーバーについてのルールがあるか、ルーティング手法が設定済みかを確認するためにリストをスキャンしてください。
  • もし該当するものがあれば、設定済みの出力PoP/サイトを確認し、ウェブサーバーとの近接性を評価してください。

  • PoP/サイトがウェブサーバーから遠くに位置している場合、設定を最適化するための2つのオプションがあります:
    -- 既存のネットワークルールを変更してウェブサーバーのIPアドレスをルールから削除します。 この変更により(デフォルトで)、ソケットが接続しているPoPからトラフィックが出力されることが可能になります。 しかし、これは常に理想的でないことがあります。直接接続されたPoPがウェブサーバーの近くにいない場合があります。
    -- 代わりに、ウェブサーバー向けの新しいネットワークルールを作成してください。 この新しいルールでは、ウェブサーバーの実際の場所により近いPoP/サイトに出力を設定します。
    構成方法については、出力ルールを設定する方法およびインターネットトラフィックのバックホールを設定するをそれぞれ参照してください。

破損した/古いブラウザキャッシュとクッキー

ブラウザのキャッシュやクッキーは、キャッシュされたリソースが古いまたは破損している場合、ウェブページのレンダリング問題を引き起こすことがあります。 これは、ウェブページのCSSやJavaScriptファイルが更新されているが、ブラウザが依然としてキャッシュ版を使用しているために、ページでの誤ったレンダリングやエラーが発生する場合に起こります。 これが問題を解決するかどうかを確認するために、ユーザーはシークレットモードでページにアクセスしてみることができます。 これがシークレットモードで機能する場合、ユーザーはブラウザのキャッシュをクリアしてページを再読み込みできます。 以下は、一部の一般的に使用されているブラウザで、ブラウザキャッシュとクッキーをクリアする方法のいくつかです。

Google Chrome:

  • Google Chromeを開き、ウィンドウの右上隅にある3つのドットアイコンをクリックします。
  • 「展開」と「閲覧データのクリア」をクリックします。
  • クリアする時間範囲を選択し、「クッキーおよびその他のサイトデータ」と
  • 「キャッシュされた画像とファイル」です。
  • 「データをクリア」をクリックします。

Mozilla Firefox:

  • Firefoxを開き、ウィンドウの右上隅にある3つのラインアイコンをクリックします。
  • 「設定」、次に「プライバシー & セキュリティ」をクリックします。
  • 「クッキーとサイトデータ」セクションまでスクロールし、「データをクリア」をクリックします。

Apple Safari:

  • Safariを開き、画面上部のメニューバーにある「Safari」をクリックします。
  • 「環境設定」または「設定」をクリックし、「プライバシー」を選択します。
  • 「ウェブサイトデータを管理」をクリックします。
  • 「すべて削除」をクリックし、「完了」を押します。

Microsoft Edge:

  • Microsoft Edgeを開き、ウィンドウの右上隅にある3つのドットアイコンをクリックします。
  • 「設定」をクリックし、「プライバシー、検索、サービス」を選択します。
  • 「閲覧データのクリア」セクションの下で「クリアする内容を選択」をクリックします。
  • 「クッキーおよびその他のサイトデータ」と「キャッシュされた画像とファイル」のチェックボックスをオンにします。
  • 「今すぐクリア」をクリックします。

問題追跡によるさらなる隔離

このセクションでは、問題を分離して根本原因を特定するためのトラブルシューティング技術を探ります。 このプロセスを支援するために、次の質問を検討してください:

  • これは中国でのみ発生していますか?
  • 回答が「はい」の場合、中国のGFWでブロックされているトラッカーまたはアドウェアによってこの問題が引き起こされているかを判断するには、中国 | ページ表示の問題を参照してください。
  • この問題は特定の(グループの)利用者数にのみ影響を与えていますか?
    回答が「はい」の場合、これらの利用者数が使用しているデバイスと他のデバイスの違いを特定する必要があります。
  • 問題は特定の時間帯にのみ発生していますか?
    そうである場合、その期間における帯域幅利用率やパケットロスを確認する必要があります。 この期間中にパケットロスが確認された場合は、パケットロス トラブルシューティング方法を参照してください。
  • 問題は特定のサイトにのみ影響していますか?
    これが一つのサイトにのみ影響を与えている場合は、影響を受けているサイトから送信される可能性のあるファイアウォール/ネットワークルールを確認してください。 それらのルールを確認して、問題に寄与している可能性があるかどうかを確認してください。 
  • 接続が特定の国から行われた場合にのみ問題が発生しますか?
    これが特定の国にも影響を与える場合は、地理的ブロックに関連している可能性があります。 詳細については、Cato IPのブラックリストまたはジオブロッキングによりウェブサイトがアクセス不能を参照してください。
  • 接続がCatoを経由しているときにのみ問題が発生しますか?
    回答が「はい」の場合、IPのブラックリストに掲載されている可能性があります。 詳細についてはCato-IPをブラックリストに登録したウェブサイトを参照してください。
  • 問題は特定のブラウザでのみ発生しますか?
    そうであれば、破損したキャッシュまたはクッキーが原因である可能性があります。 これは、ブラウザが古いためである可能性もあります。 シークレットモードでの閲覧を試み、必要であればブラウザを更新してください。 
  • ユーザーはウェブサイトに進む前に「進行する」をクリックする必要がありますか?
    ユーザーが「進行する」をクリックするとCatoの確認ページが表示され、ウェブページが部分的にロードされる場合、これは既知の制限です。 この制限の詳細については、プロンプトページ付きのサイトが正常に読み込まれないを参照してください。 

この記事のこのセクションに到達した場合、おそらくあなたが経験しているレンダリングの問題は複雑であり、さらなる分析のためにデータを収集する必要があります。 HAR、またはHTTPプロトコルアーカイブは、ウェブブラウザーとウェブサイトの間のインタラクションをキャプチャおよび記録するために使用されるファイルフォーマットです。 次のステップは、問題を再現しながらHARデータを収集することです。 このデータはさらなる分析に価値あるインサイトを提供し、レンダリング問題の潜在的な原因を特定するのに役立ちます。 指示についてはHARデータの収集方法をご覧ください。

HARデータを収集したら、収集したHARファイルを効果的に分析するための詳細な手順についてはHARファイルを使用してウェブページの問題を分析する方法を参照してください。 このガイドは、レンダリング問題を引き起こしている特定の問題を特定し、解決するのに必要な指示を提供します。

カトサポート

上記の手順でウェブページのレンダリング問題を特定し解決できなかった場合、当社のサポートチームによるさらなるレビューのために必要なデータを収集するのにご協力をお願いいたします:

  • SSSを収集してください。 サポートに必要なデータを収集し提供する方法についての詳細な指示はサポートセルフサービス SupportMe ポータルを参照してください。
  • 問題が再現されている間にHARデータを収集し、サポートケースにアップロードしてください。 詳細な指示についてはHARデータの収集方法をご覧ください。

 

この記事は役に立ちましたか?

1人中1人がこの記事が役に立ったと言っています

0件のコメント