ライブラリに関してはCDNのキャッシュを使う事も出来ますが、自作のライブラリやCSS等のリソースはCDNには登録されていないので
ファイルの転送サイズが膨れがちです。

そこで対応ブラウザの場合はリソースファイルをgz圧縮して転送するように設定する方法を備考録として書いておきます。

参考サイト

• 亜細亜ノ蛾 – Weblog – prototype.jsをgzip圧縮して利用するテスト（Safari 対応版）
• Schuzak’s Blog – Webサイトの.htaccessをいじってGZIP圧縮を使う
• C/pHeR Memo – Java とか。Eclipse とか。 – [Web]サイト高速化のための JavaScript と CSS 圧縮スクリプト

前提

転送数を減らす為にCSSとかJavaScriptとかで1ファイルにまとめられるものはまとめておく。

それに加えて圧縮をかける事により転送するデータ量を減らします。

また、gz圧縮できるアーカイバが必要。

ファイルの圧縮

まずは対象のファイルをgz圧縮します。

gz圧縮は1ファイルしか圧縮できない形式なので、まず、CSSやJavaScriptファイルを1つにまとめておきます。

別にまとめなくともこの手法は有効ですが、転送数が多いままになってしまうことと、読み込み方法によってはシリアルで読み込んでしまうのでまとめておく方が早いです。

まとめたファイルをgz圧縮します。自分の場合、windowsではExplzh、mac/linuxの場合はgzip -c [ファイル名] > [ファイル名].gzを使用しています。

.htaccessの作成

gzファイルが存在する場合はgzファイルを読み込むように設定をします。

最近は使えるサーバが多くなっていますが、mod_rewriteがサーバに入っていないと使えません。

<IfModule mod_rewrite.c>
    RewriteEngine on
    RewriteCond %{HTTP:Accept-Encoding} gzip
    RewriteCond %{REQUEST_FILENAME} !.gz$
    RewriteCond %{REQUEST_FILENAME}.gz -s
    RewriteRule .+ %{REQUEST_URI}.gz

    <FilesMatch ".html.gz$">
        ForceType text/html
        AddEncoding x-gzip .gz
    </FilesMatch>

    <FilesMatch ".txt.gz$">
        ForceType text/plain
        AddEncoding x-gzip .gz
    </FilesMatch>

    <FilesMatch ".js.gz$">
        ForceType application/x-javascript
        AddEncoding x-gzip .gz
    </FilesMatch>

    <FilesMatch ".css.gz$">
        ForceType text/css
        AddEncoding x-gzip .gz
    </FilesMatch>
</IfModule>

まず、mod_rewriteでgzファイルが存在する場合にはアクセスされたファイル名.gzを読み込むように切り替えています。

そして、FileMatchでファイル毎にMIME-TYPEとgzエンコードを指定しています。

これによってgz圧縮ファイルに対応しているブラウザの場合はgzファイルを読み込めるようになります。

更に高速化

これだけでファイルのサイズが下がりますが、キャッシュで持たせるようにしておきます。

これも.htaccessに記述する事によって利用可能です。

ExpiresActive on
ExpiresDefault "access plus 1 month"
FileETag None