「クリティカルなリクエストの深さの最小化」とは？改善方法も解説【PageSpeed Insights】
Googleが提供する無料のWebページ診断「PageSpeed Insights」。診断にかけるとWebページの読み込み時間の短縮につながるヒントが得られます。
その中のひとつである「クリティカルなリクエストの深さの最小化」とはどういう意味か、また診断結果を改善する方法についても解説します。
「クリティカルなリクエストの深さの最小化」とは？
「クリティカルなリクエストの深さの最小化」とは、Webページの表示を遅くさせている重大な項目を効率的に読み込んで、ページを表示する時のパフォーマンスを上げることです。「page speed insights」でWebサイトのURLを入力し調べると、そのサイトのパスがツリー状になって表示されます。Webページを読み込む時の速さを表している、ツリー状になっている図をクリティカル リクエスト チェーンと呼びます。この図の特徴は、画像や文書などのデータファイル（リソース）を読み込んだ時にかかる時間や、データのサイズが分かることです。このリソースに優先度をつけることで、より速くWebページを表示させるにはどうすればよいのか分かります。
「クリティカルなリクエストの深さの最小化」の改善方法
改善方法の考え方
クリティカルリクエストチェーンとはクリティカルレンダリングパス（CRP）と呼ばれるページを最適化する技術の１つです。クリティカルレンダリングパスとは、ユーザーがWebページを操作する際に関係のあるコンテンツを表示するときの優先順位をつけることという意味になります。クリティカルリクエストチェーンに表示される枝分かれしたリソースのそれぞれをチェーンと呼びます。このチェーンには、リソースごとのダウンロードにかかった時間とその容量の大きさ（バイト数）の詳細を表示することができます。この図の優位点はWebページの表示を最も効率的に表示させるための改善点を見つけることです。この情報を元にして最適化していきます。
有効的な改善方法
まずは、Webページを遅くさせているリソースの数を小さくさせたり、いらないリソースを削除することが効果的でしょう。次に、データのダウンロードをする時間の短縮もWebページの表示を高速化できます。ユーザーがまだ必要としていないリソースを表示させるのを遅くさせるのも効果的です。非同期と呼ばれる発信元と受信元がタイミングを合わすことなく通信、処理を行わせることも表示の短縮につながります。ラウンドトリップ数（通信の往復の回数）の削減も行ったほうがよいでしょう。そして残りの重要なデータファイルの読み込み順番を最適化していきます。ツリー状になっているチェーンの長さを短くし、全部のリソースをなるべく効率的かつ最速に表示、ダウンロードできるようにしていきましょう。
その他の改善方法
CSS（スタイルシート）のデータファイル容量が大きくなるとWebページの表示を遅くさせる原因の一つになります。Webページに使用されるJavaScriptのデータを小さくすると表示にかかる時間が速くなります。コードを見直し余分なコードはないか確かめましょう。また、画像サイズが大きすぎるのも遅延化の原因ですので、画像サイズを小さくしたりして最適化を図っていきましょう。拡張子もjpegやping形式の圧縮データにするとより表示が速くなります。
