[Server & Network General] Apache: mod_deflate, mod_expire でページの表示速度を改善する

公開日: 2013/12/26
更新日: 2019/09/19

Google Analytics で怒られるアレについて調べたことをまとめておきます。

[markdown]
本当はいろいろ手を動かして確認したいところですが、ひとまず淡々と更新します。

* mod_deflate でコンテンツを圧縮
* mod_expire でキャッシュを制御

## Apache への導入

回線がボトルネックになっているのかを確認する方法、モジュールのインストールから説明されている。

> * [実用 Apache 2.0運用・管理術（4）：mod_deflateによるコンテンツの圧縮転送 (1/3) – ＠IT](http://www.atmarkit.co.jp/ait/articles/0510/07/news107.html)
> * [第18回　知っておきたいApacheの基礎知識その14：UNIX的なアレ：gihyo.jp出張所｜gihyo.jp … 技術評論社](http://gihyo.jp/admin/serial/01/unix/0018)

### Nginx

Nginx の場合は、このような設定のよう。

> * [Nginx でgzipを使うには | レンタルサーバー・自宅サーバー設定・構築のヒント](http://server-setting.info/centos/apache-nginx-6-gzip-use.html)

## .htaccess もしくは httpd.conf で設定

html5-boilerplate を確認するのがよさそう。

> * [html5-boilerplate/.htaccess at master · h5bp/html5-boilerplate · GitHub](https://github.com/h5bp/html5-boilerplate/blob/master/.htaccess)

設定等。

> * [【Apache】Webページの読み込みを高速化する設定(gzip圧縮/Expire) | バシャログ。](http://c-brains.jp/blog/wsg/12/08/14-141410.php)
> * [gzip圧縮でWebコンテンツを高速化 | Webクリエイターネット](http://www.webcreator-net.com/tips_memo/server/20120525083004.html)

SVG 対応で少し試してみた例。

> * [SVG まわりの状況と、SVGO によるファイル最適化 | deadwood](https://www.d-wood.com/blog/2013/12/12_5116.html)

### mode_rewrite

mod_deflate が利用できない場合は、事前に gzip したファイルを用意し、mode_rewrite で代替する。

> * [改行削除するくらいなら gzip したらいいじゃない | WWW WATCH](http://hyper-text.org/archives/2012/11/webcontents_gzip.shtml)
> * [ページの表示速度を改善する方法 | Web Design Leaves](http://www.webdesignleaves.com/wp/htmlcss/217/)

こんな形で gzip する。

> * [Grunt: JavaScript や CSS を gzip する | deadwood](https://www.d-wood.com/blog/2013/12/03_5071.html)

## 確認

動作を確認するにはヘッダーを確認する。

> * [Chrome Developer Tools で HTTP Header を確認する方法 | deadwood](https://www.d-wood.com/blog/2013/12/06_5088.html)
> * [curl/wget で HTTP Header を確認する方法 | deadwood](https://www.d-wood.com/blog/2013/12/10_5102.html)

“`prettyprinted
Accept-Encoding: gzip,deflate,sdch
Content-Encoding: gzip
Expires: Wed, 04 Dec 2013 08:00:43 GMT
“`

“`
Cache-Control:max-age=2592000
“`

> * [[Studying HTTP] HTTP Header Fields](http://www.studyinghttp.net/header)

こんなツールもある。

> * [Port80 Software » Contact » Join Port80's Beta Testing Team](http://www.port80software.com/support/p80tools)
[/markdown]