Pocket

apache mod_deflate でWebコンテンツを圧縮する手順と結果検証

  • add this entry to hatena bookmark

Google Developers の PageSpeed Insights でサイトを分析してみると、サイトの状態が「モバイル」の観点と「パソコン」の観点で評価された数値が示されます。また、同時に、改善点を「提案の概要」として示してくれます。

今回、PageSpeed Insights で分析したところ、「Should Fix」で「圧縮を有効にする」事を提案いただきました。

「gzip や deflate を使用してリソースを圧縮することで、ネットワークで送信されるバイト数を減らすことができます。」との事です。

よって、mod_deflate を apache に導入しました。その作業記録と、mod_deflate 導入前後の比較結果を記載します。

1.まず、環境情報の確認

apache バージョンは、2.4系です。

OSは、CentOS 6.x です。

ちなみに、「Deflate」とは「可逆データ圧縮アルゴリズム」との事です。

apache での現状のモジュール状況を確認したところ、mod_deflate は読み込まれていない状態でした。

# /usr/local/apache2/bin/httpd -M | grep deflate
#

導入したいモジュールは「mod_deflate.so」です。OS上で検索してみると、apache インストール時に作成されているようでした。

# ls -1 /usr/local/apache2/modules/mod_deflate.so
/usr/local/apache2/modules/mod_deflate.so
#

よって、次は、apache の設定に入ります。

2.apache 設定

まず、先に、httpd.conf で mod_deflate.so をロードしておきます。以下のようにモジュールをロードする設定を入れます。

LoadModule deflate_module modules/mod_deflate.so

設定後、apache を再起動します。ロードされているかどうかを確認すると、ちゃんとロードされています。

# /usr/local/apache2/bin/httpd -M | grep deflate
 deflate_module (shared)
#

次に、deflate用の設定ファイル「httpd-deflate.conf」を extraディレクトリに作成します。

内容は、以下のように mod_deflate -Apache HTTP サーバ と同様の内容にしました。環境によって最適な設定内容は変わりますので、ご自身の環境に合わせて設定をお願いします。

<Location />
# Insert filter
SetOutputFilter DEFLATE

# Netscape 4.x has some problems...
BrowserMatch ^Mozilla/4 gzip-only-text/html

# Netscape 4.06-4.08 have some more problems
BrowserMatch ^Mozilla/4\.0[678] no-gzip

# MSIE masquerades as Netscape, but it is fine
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html

# Don't compress images
SetEnvIfNoCase Request_URI\.(?:gif|jpe?g|png)$ no-gzip dont-vary

# Make sure proxies don't deliver the wrong content
Header append Vary User-Agent env=!dont-vary

</Location>

このファイルを、httpd.conf から読み込みます。

Include conf/extra/httpd-deflate.conf

以上で、設定編集は完了です。

設定内容に構文違いかないかチェックします。

# /usr/local/apache2/bin/apachectl configtest
Syntax OK
#

問題ないようです。(# /usr/local/apache2/bin/httpd -t でも同じです。)

apache を再起動すると設定が完了です。

3.mod_deflate の効果測定

まず、PageSpeed Insights で導入効果を分析してみます。以下はmod_deflate 導入前後の比較表です。

項目 モバイル パソコン
mod_deflate 導入前 60/100 72/100
mod_deflate 導入後 66/100 83/100

元々改善すべき点が多かったのですが、mod_deflate を導入したら、点数が上がりました。

次は、Firebug で測定した「全リクエストの合計サイズ」を、mod_deflate 導入前後で比較した表です。以下は全て同じページ(URL)で確認しています。

項目 回数 リクエスト数 全リクエストの合計サイズ
mod_deflate 導入前 1回目 52件 99.0KB
2回目 52件 90.2KB
3回目 52件 125.6KB
4回目 52件 127.9KB
5回目 53件 88.1KB
mod_deflate 導入後 1回目 61件 80.8KB
2回目 52件 44.7KB
3回目 52件 54.5KB
4回目 52件 54.5KB
5回目 52件 48.9KB

mod_deflate 導入後に、「全リクエストの合計サイズ」は相対的に減っています。圧縮効果が出ています。

Webコンテンツが圧縮されたので、同時にWebアクセスの高速化が実現できていればよいのですが、簡単に計測した感じでは、分かり易い数値結果はありませんでした・・・。PageSpeed Insights で、まだ改善の提案が出ているので、それの対策もすべきですね。

Pocket

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です


*

チェックサイト RSS Feed読者登録はいかがでしょうか?RSS配信中です。