僕がよく拝見している「love guava!」さんのブログでhtaccessにキャッシュをしてブログを高速化する方法が紹介されていました。
僕はブログのキャッシュではApacheの「mod_expires」を利用していたのですが、試しにmod_expiresと.htaccessの比較をしてみました。
mod_expiresの設定方法は僕が以前に投稿したこちらをご覧いただければと思います。
試したいことは以下の3点を評価してみたいと思います。
1.mod_expiresとhtaccessのどちらも設定なし
2.mod_expiresの設定だけを有効にする
3.htaccessの設定だけを有効にする
評価方法としては、よく利用しているGTmetrixで計測をしてみたいと思います。
mod_expiresとhtaccessのどちらも設定なし
僕はmod_expiresを使用していたので、まずはmod_expiresを使わないようにします。
設定ファイルを編集 # vim /etc/httpd/conf/httpd.conf 以下のような行をコメントアウトします。 #<IfModule mod_expires.c> #ExpiresActive on #ExpiresByType image/png "access plus 12 hours" #ExpiresByType image/jpeg "access plus 12 hours" #ExpiresByType image/gif "access plus 12 hours" #ExpiresByType text/css "access plus 12 hours" #ExpiresByType text/javascript "access plus 12 hours" #ExpiresByType application/x-javascript "access plus 12 hours" #ExpiresByType application/x-shockwave-flash "access 12 hours" #ExpiresDefault "access plus 1 days" #</IfModule> Apacheを再起動します。 # /etc/init.d/httpd restart
そして、GTmetrixでサイトの評価を計測します。
結果は以下の図の通りです。
まぁ、この評価はこの後の評価の基準になるので特にコメントはありません。
mod_expiresだけを有効にする
先ほどの無効にした時の設定を戻します。
設定ファイルを編集 # vim /etc/httpd/conf/httpd.conf 以下のような行をコメントアウトを解除します。 <IfModule mod_expires.c> ExpiresActive on ExpiresByType image/png "access plus 12 hours" ExpiresByType image/jpeg "access plus 12 hours" ExpiresByType image/gif "access plus 12 hours" ExpiresByType text/css "access plus 12 hours" ExpiresByType text/javascript "access plus 12 hours" ExpiresByType application/x-javascript "access plus 12 hours" ExpiresByTye application/x-shockwave-flash "access 12 hours" ExpiresDefault "access plus 1 days" </IfModule> Apacheを再起動します。 # /etc/init.d/httpd restart
そして、GTmetrixでサイトの評価を計測します。
ん？！
mod_expiresを有効にした方が評価は下がり、ページの読み込み速度も遅くなっている。。。
この状態は良くないので、なんとかしなくてはならない感じです。
最後に.htaccessだけを有効にする
再びmod_expiresを無効にします。
設定ファイルを編集 # vim /etc/httpd/conf/httpd.conf 以下のような行をコメントアウトします。 #<IfModule mod_expires.c> #ExpiresActive on #ExpiresByType image/png "access plus 12 hours" #ExpiresByType image/jpeg "access plus 12 hours" #ExpiresByType image/gif "access plus 12 hours" #ExpiresByType text/css "access plus 12 hours" #ExpiresByType text/javascript "access plus 12 hours" #ExpiresByType application/x-javascript "access plus 12 hours" #ExpiresByType application/x-shockwave-flash "access 12 hours" #ExpiresDefault "access plus 1 days" #</IfModule> Apacheを再起動します。 # /etc/init.d/httpd restart
そして、「.htaccess」を編集します。
# vim /<ドキュメントルート>/.htaccess
以下の3行を追記して保存します。
<Files ~ ".(gif|jpe?g|png|ico|js|gz)$">
Header set Cache-Control "max-age=2592000"
</Files>
一行目でキャッシュさせるファイルの拡張子を指定して、2行目の「max-age=2592000」でキャッシュの有効期限を秒数で指定します。
ちなみに、「.htaccess」は「wp-login.php」のファイルや「wp-content」のディレクトリが保存されている所にあります。
「.htaccess」はディレクトリ単位で有効にできるので、画像ファイルだけに有効にしたい場合は「images」ディレクトリに新規作成して保存しても使えます。
僕の場合はTeraTermなどのターミナルソフトでサーバにSSHでログインしてからファイルの操作をしていますが、FTPの環境がある場合はローカルPCで編集してFFFTPなどのツールでアップロードしても問題ありません。
ファイルの編集が完了すれば、評価を計測してみます。
結果としては、評価は3例の中で一番良い結果になりました。
しかし、ページの読み込み速度は、3例の中で一番遅い結果になってしまいました。
検証のまとめ
ページの読み込み速度を優先するのであれば、キャッシュ機能は使わず、Googleからの評価を優先するのであれば、.htaccessでキャッシュを使用するという結果になりました。
SEO的にはGoogleの評価を優先にしたいので、
.htaccessでキャッシュを使用する
という方針で行きたいと思います。