キャッシュを有効化すると次回アクセス時に表示が高速化されるので、設定しておいて損はないと思うんですが、いつも「どうやってたっけ?」となるので自分がコピペするようにメモしました。
やってること
コンテンツタイプ追加
アイコンとjsonとフォントのコンテンツタイプを追加。(textとかhtmlとか画像は追加済みだと思う)
gzip圧縮を有効化
古いブラウザで問題があるので除外。
本当は最初の1行で全部圧縮が有効になる。【訂正】最初の1行で全部圧縮が有効になる環境と、いちいちMIMEタイプ指定して追加しないと有効にならない環境がありました。
そもそも圧縮済みの画像は圧縮しない。
キャッシュの寿命を指定
phpは30秒、htmlとかtxtは1週間、cssとかjavascriptとかmapファイル、あと画像が3カ月、pdfは1カ月、フォント関係は6カ月に設定してみた。というか、自分の場合、画像やスクリプトは読み込むときに末尾に「?v=(バージョン番号)」みたいな感じで更新日時とかバージョンを追加するようにしているので、長くても問題ないのだ。
あと注意点としては「plus」+数字の後に使える単位として、”years”、”months”、”weeks”、”days”、”hours”、”minutes”、”seconds”、があるんだけど、数字が1の時は単数形、数字が複数の時は複数形にしておくのを忘れないように。
というわけでコード
<IfModule mime_module.c>
AddType image/x-icon .ico
AddType application/json .json .map
AddType image/svg+xml .svg
AddType application/x-font-ttf .ttf
AddType application/x-font-woff .woff
AddType application/x-font-woff2 .woff2
AddType application/x-font-opentype .otf
AddType application/vnd.ms-fontobject .eot
AddType application/pdf .pdf
</IfModule>
<IfModule mod_deflate.c>
<IfModule mod_filter.c>
SetOutputFilter DEFLATE
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSI[E] !no-gzip !gzip-only-text/html
SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png)$ no-gzip dont-vary
AddOutputFilterByType DEFLATE text/plain text/html text/xml application/xml application/xhtml+xml
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE application/rss+xml application/atom_xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/javascript application/x-javascript
AddOutputFilterByType DEFLATE application/json
AddOutputFilterByType DEFLATE application/x-httpd-php
AddOutputFilterByType DEFLATE application/x-font-ttf application/x-font-woff application/x-font-woff2 application/x-font-opentype application/vnd.ms-fontobject
AddOutputFilterByType DEFLATE application/pdf
</IfModule>
</IfModule>
<IfModule mod_expires.c>
ExpiresActive On
<FilesMatch "\.(php)">
ExpiresDefault "access plus 30 seconds"
</FilesMatch>
<FilesMatch "\.(html|txt)">
ExpiresDefault "access plus 1 week"
</FilesMatch>
<FilesMatch "\.(css|js|map)">
ExpiresDefault "access plus 3 months"
</FilesMatch>
<FilesMatch "\.(gif|jpe?g|png|svg)">
ExpiresDefault "access plus 3 months"
</FilesMatch>
<FilesMatch "\.(pdf)">
ExpiresDefault "access plus 1 month"
</FilesMatch>
<FilesMatch "\.(otf|eot|woff|woff2|ttf)">
ExpiresDefault "access plus 6 months"
</FilesMatch>
</IfModule>
こんな感じになりました。
その他
サイトによっては、wordファイルやExcelファイルなんかも追加する必要があるかもしれない。
気が付いたらちょこちょこ改善していく予定。
