このブログはブログ名にもあるように WordPress で動いている訳ですが、なんだか最近動きがもっさりしていた。テンプレートファイルをいじくったり プラグインをインストールしたりしている間にもっさりもっさり。
これはイカンということで色々と手をいれてみました。
手を入れる前は、記事ページが表示されるまでにおおよそ 5秒前後かかってました。それまでモッサリと思ってたけど、数値として視覚化されちゃうと、モッサリというより普通に遅かった。
関連記事：Google の Chrome Developer Tools で サイトの表示速度を計ってみた
っで、WEB ページの表示が遅い原因は様々だけど、WEB サーバーに対するリクエスト数の多さも表示が遅くなるひとつの大きな原因です。
なので、自分のブログが遅いなーと感じている人は、自分のブログのリクエスト数を確認してみると良いかもしれません。
今回は、Google Chrome に標準機能として付いている Chrome Developer Tools を使ってリクエスト数を確認してみます。
そもそもリクエスト数とは何ぞや？
ある WEB サイト（ブログ）へアクセスすると、そのページが表示されますが、ページが表示されるまでに、ブラウザ（つまり自分の PC）と WEB サーバーは数十回のやりとり（通信）をしています。100回以上のやりとりもザラ。
ブラウザが WEB サーバーから HTML ファイルを受け取ると、ページに必用なリソース（CSS ファイルや画像ファイルや Javascript のファイルなど）をひとつひとつ WEB サーバーに要求します。これがリクエスト。
単純に画像が 100 枚ある WEB ページだと、それだけで 100 回のリクエストが発生します。小ちゃなアイコンが10個あればそれも10回リクエストが必要。
もちろんユーザーは WEB ページ上のリンクを1回クリックしたりするだけですが、実はこれだけのリクエスト（通信）が発生していて、ブラウザからのリクエストがあるたびに WEB サーバーはそれに反応して必要な処理をして、リクエストされたファイルをブラウザへ送信します。
なので、通信回線が遅いほど、WEB サーバーの性能が低いほど、リクエスト回数に比例して、WEB ページの表示速度は低下しちゃう。
だから、リクエスト回数を減らすことは WEB ページの高速化をする上で重要な要素のひとつです。
Chrome Developer Tools でリクエスト数を確認してみる
まずは Chrome Developer Tools を起動してみます。
Chrome のウインドウ内で右クリックすると一番下に「要素を検証」というメニューが出てくるのでそれをクリックすると、別ウインドウで Chrome Developer Tools が起動します。
起動したら、
- ネットワークをクリックします。
- ブラウザに戻ってリクエスト数を確認したい WEB ページにアクセスします。例えば Yahoo! JAPAN のトップページにアクセス。
- Chrome Developer Tools の一番下に、WEB ページを表示するために必要なリクエスト数が表示されます。
この Yahoo! JAPAN トップページを表示するために要するリクエスト数は38 回。
Yahoo! のトップページにはそれなりの数の画像やらアイコンやらがありますが、これだけのものをたった38回のリクエストで表示できるようにしているとはさすが Yahoo!。ちなみに左側のサイドバーだけで画像（アイコン）が 30 くらいあります。
また、リクエスト回数のとなりに、データの転送量が表示されます。この場合は、325.66KB。
自分のブログのリクエスト数を確認してみた
Yahoo! のリクエスト数をベンチマークとするのは無謀すぎるので、一般的な個人ブログのリクエスト数を調べてみました。
ちゃんと統計を取った訳じゃないけど、20から30の個人ブログをザーッとながめたところ、だいたい 100 リクエストくらいのブログだとまぁまぁ速いかなと感じました。
ってことで早速このブログのリクエスト数を確認してみました。
リクエスト数はトップページで 107。記事ページで 120 から 130 くらいです。
ただ元々はトップページで 180 くらい。記事ページなんかだと 200 を超えるページも。
必要なリクエスト数を減らすテクニックはいろいろとある訳ですが、実はそんなにたいした事はやってません。
むしろ、それだけ！？って感じです。だけどもったいなくて教えたくありません。
うそです（笑）
ちょっと長くなったのでまた今度ちゃんと記事にします。
でわでわ。
