mod_setenvifの設定「pajespeed tools insights」

引き続きサイト読み込み速度の対策をやっております。

アナリティクスレポートサイトの速度について述べさせて頂き居ます。サイトの速度メインブログの1000PV/日超えにしたがい、アナリティクスレポートのサイト速度のページ速度が、徐々にスピードダウンしているレポートが、目立ちますね。関連記事...

ブラウザのキャッシュを活用する、説明がありますが、生憎理解する能力がありません、調べるうちに僕でも出来そうな対策方法を見つけましたので紹介します。

概要

静的なリソースをブラウザでキャッシュすると、ユーザーがサイトに複数回アクセスした場合に時間を節約できます。キャッシュヘッダーは小さなサブセット（画像など）だけでなく、キャッシュできる静的なリソースにすべて適用されます。キャッシュできるリソースには、JS ファイル、CSS ファイル、画像ファイル、その他のバイナリオブジェクトファイル（メディアファイル、PDF など）があります。一般に HTML は静的ではないため、デフォルトではキャッシュ可能と見なさないようにしてください。サイトの HTML にとってどのようなキャッシュポリシーが適しているか検討する必要があります。

推奨される解決方法

サーバーでブラウザのキャッシュを有効にします。静的なリソースのキャッシュの有効期間は 1 週間以上にしてください。広告やウィジェットなどのサードパーティリソースの場合は、キャッシュの有効期間を 1 日以上にします。キャッシュ可能なすべてのリソースで、次のような設定をおすすめします。

概要
推奨される解決方法

mod_setenvifの設定
レッドカードからイエローカード
あとがき

mod_setenvifの設定

Apacheのmod_expiresモジュールでキャッシュをコントロールするという良い対策方法です。ロリポップザーバーでも対応しているそうですので、試してみることにしました。

ロリポップ設定手順

ロリポップユーザー専用ページにアクセスして頂いて、WEBツールのロリポップFTPからhtaccessを開きます。

ロリポップFTP

htaccessのファイルに下記に示したコードを記述します。これだけです。

htacess2017-02-25-2

バックアップは取るべきでしょうが、追記するだけですから、元に戻したいときは追記部分を削除すれば、元通りになります。

ExpiresDefault　ExpiresByType

二つの書式が、用意されています。

ExpiresDefault “<base> [plus] {<num> <type>}*”

ExpiresByType type/encoding “<base> [plus] {<num> <type>}*”

ExpiresDefaultは全てのファイルを対象にします。一括設定可能なタイプですね。

ExpiresByTypeは、個別設定が可能なタイプです。

numとtypeの書式

「num」は整数、typeは以下を使用します。

years・months・weeks・days・hours・minutes・seconds

1カ月は「1 months」、「4 weeks」など、1日は「1 day」、時間は「12 hours」など。

実際に設定した内容

以下のように設定しました。

# BEGIN Browser Cache

<ifModule mod_expires.c>
ExpiresActive On
ExpiresByType text/css “access plus 1 days”
ExpiresByType image/gif “access plus 1 weeks”
ExpiresByType image/jpeg “access plus 1 weeks”
ExpiresByType image/png “access plus 1 weeks”
ExpiresByType application/x-javascript “access plus 1 weeks”
</ifModule>

# END Browser Cache

考え方次第ですが、text/cssの１dayは1 weeksに延長が必要のような気がします。その他は1 monthsにすべきか迷いましたが、こちらにしました。