クリティカルリクエストチェーンとは、ページのレンダリングに必要な、依存関係にある一連のネットワークリクエストです。この問題への対処方法や回避方法を学びます。以下をお読みください。
重要なリクエストとは何ですか?
クリティカルリクエストとは、ページのレンダリングに必要なリクエストです。つまり、リクエストが失敗すると、ページはレンダリングされません。クリティカルリクエストは、確実に完了するために、他のリクエストよりも優先される必要があります。.
クリティカルなリクエストを行う方法はいくつかあります。最も一般的な方法は、 async属性ことです。これは、このスクリプトのダウンロード中もブラウザに他のリソースの読み込みを継続するよう指示します。クリティカルなリクエストを行うもう1つの方法は、リソースをHTMLコード自体にインライン化することです。これにより、ブラウザはリソースの取得に再度ラウンドトリップを待つ必要がなくなりますが、HTMLコードのサイズは大きくなります。
ページのレンダリングに必要なリソースに対する重要なリクエストのみを行うことが重要です。重要なリクエストを過度に行うと、ページの読み込みが遅れ、最終的にはユーザーエクスペリエンスの低下につながる可能性があります。.
重要なリクエストの連鎖を回避するにはどうすればよいですか?
- ドメインシャーディング技術の使用：重要なリクエストの連鎖を避ける主な方法の一つは、ドメインシャーディング技術の使用です。ドメインシャーディングを使用すると、コンテンツを複数のドメインに分割できるため、DNSルックアップの回数を減らし、ページの読み込み時間を短縮。
- CDN の使用: CDN は、世界中のサーバーにコンテンツをキャッシュすることでページの読み込み時間を短縮し、訪問者がコンテンツに簡単かつ迅速にアクセスできるようにします。
- ウェブサイトのパフォーマンスを最適化する：ウェブサイトのパフォーマンスを最適化することで、重要なリクエストの連鎖を避けることもできます。これには、HTML、CSS、JavaScriptファイルの縮小、画像の圧縮、キャッシュプラグインの使用などが含まれます。
重要なリクエストの連鎖の代替手段
重要なリクエストを連鎖させる代わりに、パフォーマンスの向上に役立ついくつかの代替手段があります。
1. リソースのインライン化：これは、重要で小さなリソースを、個別のHTTPリクエストを発行するのではなく、HTMLコードに直接埋め込むことを意味します。データURI、またはインラインスクリプトとスタイルを使用することで、これを実現できます。
2.リソースのプリロード：ブラウザに特定のリソースを事前に取得するよう指示し、必要な時に利用できるようにします。これは、リンクタグまたはリソースヒントを介して行うことができます。
3. リソースのキャッシュ：キャッシュストアはリソースにローカルで頻繁にアクセスするため、使用するたびにサーバーから取得する必要はありません。キャッシュヘッダーやサービスワーカーを使用することで、これを実現できます。
4. リクエスト順序の最適化：リソースリクエストの順序はパフォーマンスに影響を与える可能性があるため、重要なリソースが最初にリクエストされるようにすることが重要です。これは、preloadキーワードを使用するか、リソースリクエストの順序を手動で変更することで実現できます。
5. ラウンドトリップタイムの最小化：ラウンドトリップタイム（RTT）とは、リクエストがブラウザからサーバーへ、そして再びブラウザへ戻るのにかかる時間です。RTTを短縮することでパフォーマンスを向上させることができます。RTTを短縮する方法はいくつかあります。例えば、持続接続の使用、DNSルックアップの最適化、リダイレクトの削減などが挙げられます。
結論
この記事が、クリティカルチェーンリクエストの回避の重要性をご理解いただく一助になれば幸いです。クリティカルチェーンリクエストを回避することで、ウェブサイトの読み込み速度を向上させ、ユーザーエクスペリエンスを向上させることができます。変更内容を本番サイトに実装する前に、必ずテストを行ってください。ご不明な点がございましたら、お気軽にサポートチームまでお問い合わせください。
