元旦に簡単にできるサイトの高速化対策をしてみた。

2013年1発目ということで、すぐにできそうなやつを。

タメルヒトコトのコンテンツ量が多くなってきて、サイトが結構重くなってきたので、手軽にできそうな高速化対策をいくつかやってみた。

1.とりあえず現状把握から

測定ツールとして色々なものがあるけど、今回はPageSpeed Insightsを利用してみた。

PageSpeed Insights

クリティカルパスエクスプローラを確認してみると、トップページの全要素表示にだいたい3秒くらい。今回はこれを最低でも2秒くらいにしてみる。

2.改善対応 – 画像の最適化

とりあえず高い優先度のものから対応。
「画像を最適化」が一番簡単に対応できそうな気がしたので、これから対応。

pngファイルに関しては以下のサイトを使えば簡単に画像を最適化してくれる。べんりー
Tiny PNG
これ以外のファイルに関しては、地道に圧縮。

3.改善対応 – 静的なコンテンツをgzip圧縮

同じく優先度の高いものとして「圧縮を有効にする」という項目があったので、これを対応、
具体的にはmod_deflateを利用して、コンテンツをgzip圧縮して通信してみた
圧縮するコンテンツは、html、css、javascriptを対象を対象

既に、mod_deflateが入っていれば以下の記述をhttpd.confで読み込まれるファイルに記載しておけばすぐ適用される。

BrowserMatch ^MSIE [6-9] gzip
BrowserMatch ^Moxilla/[5-9] gzip
AddOutputFilterByType DEFLATE text/html text/css application/x-javascript

上2行の記述は、ブラウザによってgzip圧縮をしないようにしています。

ここまで対応してもう一度PageSpeed Insightsで測定してみたら、平均が1.9秒になっていた!
ただ、キャッシュ周りも見直せばもっと早くなるはずなので、もうちょっと調べてみよう。