圧縮した JavaScript ファイルを利用する
gzip で圧縮した JavaScript ファイルを使って、ダウンロード時の帯域を節約することができる。
基本は、.jgz と .js.gz と Apache の設定のとおり。
これをベースに自分なりに書き換えてみた。
Apache を用いる。.htaccess に書くこともできるけれども、オーバーヘッドがあるので、httpd.conf に書くという前提で、以下のようにする。
<Directory "/htdocs/javascripts"> <Files ~ "\.js"> RewriteEngine on RewriteCond %{HTTP:Accept-Encoding} gzip RewriteCond %{REQUEST_FILENAME}\.gz -s RewriteRule ^(.+)$ $1.gz ForceType text/javascript AddEncoding x-gzip .gz </Files> </Directory>
mod_rewrite という URL => ファイルマッピング用のモジュールを使うので、これは有効にしておかなければならない。
ここでは、Apache のドキュメントルートを /htdocs と考えよう。すると、たとえば /htdocs/javascripts/test1.js.gz に対しては次のようにアクセスできる。
<html> <head> <script type="text/javascript" src="http://example.com/javascripts/test.js"></script> ...
面白いのは、ファイル名としては、"test1.js.gz" なのに、"test1.js" としてアクセス可能なことだ。さらに、もし "test1.js.gz" はないが、"test1.js" はある場合ならば "test1.js" の内容が圧縮されずに返却される。つまり "*.js" でも "*.js.gz" のどちらもが利用可能で、両方ある場合は、"*.js.gz" のほうが優先されるということだ。
一応興味のある人向けに、httpd.conf の中身を解説しておくと以下の通り。
# /htdocs/javascripts とそのサブディレクトリに対してのみ有効な設定 <Directory "/htdocs/javascripts"> # ".js" で終わる URL に対してだけ有効な設定 <Files ~ "\.js$"> # Rewrite エンジン使用開始(お約束) RewriteEngine on # %{HTTP:xxx} は xxx というリクエストヘッダを意味する。 # この場合 Accept-Encoding というリクエストヘッダに # "gzip" という文字列が含まれていたら、次に進む RewriteCond %{HTTP:Accept-Encoding} gzip # /htdocs/javascripts/xxx.js.gz というファイル名はあれば次へ進む。 RewriteCond %{REQUEST_FILENAME}\.gz -s # RewriteRule の第1、第2引数は、s/xxx/yyy という正規表現を # 用いた置換コマンドの xxx, yyy にそれぞれあたる。 # 第一引数で URL 全体にマッチ。第2引数でそれに ".gz" を付加。 RewriteRule ^(.+)$ $1.gz # 強制的に Content-Type を "text/javascript" に。 ForceType text/javascript # .gz という拡張子については、Content-Encoding レスポンスヘッダを gzip に設定 # そうすることで、ブラウザは自動的に受け取ったファイルを解凍してくれる。 AddEncoding x-gzip .gz </Files> </Directory>