Nginxでngx_pagespeedを使ってみたよ。

Apacheの mod_pagespeed というモジュールがGoogleさんから出されていたのは知っていましたが、そのNginx版があるということなのでいれてみました。

 

効果はこのサイトで測ったところ、表示速度が 3秒 → 2秒 になりました。
1秒変わるってすごいことなのよ。ほんとに。(゚д゚)!

 

表示速度はSEOにも関係してくるので、重要なのよ。

 

導入

をかもとさんのブログ(dogmap.jp)の
Nginx 用 pagespeed モジュール ngx_pagespeed を試してみたよ
を参考にさせて頂きました。感謝m(__)m

 

この記事ですと、ソースからビルドしていますがキャッシュパージモジュールもあるので、rpmファイルを作ってインストールすることにしました。

 

というわけで src.rpm のダウンロードから。(centos6)

wget http://nginx.org/packages/centos/6/SRPMS/nginx-1.2.6-1.el6.ngx.src.rpm
rpm -ivh nginx-1.2.6-1.el6.ngx.src.rpm

githubからpagespeedのソースを持ってくる。

cd ./rpmbuild/BUILD
git clone https://github.com/pagespeed/ngx_pagespeed.git

ついでにキャッシュパージモジュールも

cd ./rpmbuild/SOURCES/
wget http://labs.frickle.com/files/ngx_cache_purge-2.0.tar.gz

インストール用ファイルの書き換え

cd
cd ./rpmbuild/SPECS/
cp nginx.spec nginx.spec.org
vi nginx.spec

該当箇所に以下を挿入・変更

// define
%define _unpackaged_files_terminate_build 0
%define ngx_cache_purge_version 2.0

// version
Version: 1.2.6

// source
Source10: ngx_cache_purge-%{ngx_cache_purge_version}.tar.gz
Source11: nginx_pagespeed

// patch (%prepと%buildの間)
#%patch0 -p0
%setup -T -D -a 10

// build (%buildの直下)
export LANG='ja_JP.UTF-8'

// configure (./configureの下に追加)
    --add-module=%{_builddir}/nginx-%{version}/ngx_cache_purge-%{ngx_cache_purge_version} 
    --add-module=%{_builddir}/ngx_pagespeed 

// make (%makeの直下)
mv ngx_cache_purge-2.0/CHANGES ngx_cache_purge-2.0/CHANGES.ngx_cache_purge
mv ngx_cache_purge-2.0/README.md ngx_cache_purge-2.0/README.ngx_cache_purge

// doc (%docを追加)
%doc
ngx_cache_purge-2.0/CHANGES.ngx_cache_purge ngx_cache_purge-2.0/README.ngx_cache_purge

こんな感じ。

 

インストールファイルのビルド

rpmbuild -bb nginx.spec

インストール

cd
cd ./rpmbuild/RPMS/x86_64/
rpm -Uvh nginx-1.2.6-1.el6.ngx.x86_64.rpm

確認 (–add-module=***/rpmbuild/BUILD/ngx_pagespeedが入っているか)

nginx -V

こんな流れ。Nginxの設定は適宜やってね。

 

設定

ちなみにpagespeedの設定はこんな感じらしい。

pagespeed on;
pagespeed RewriteLevel CoreFilters;
pagespeed FileCachePath /var/cache/ngx_pagespeed_cache;
pagespeed EnableFilters collapse_whitespace,remove_comments;

一番下のEnableFiltersに関しては
ngx_pagespeed Examples Directory

ここを参考に増やしたり減らしたりしてみてください。

 

この設定は
collapse_whitespace : htmlの空白を埋める
remove_comments : html内のコメントを削除
になってます。

設定によっては表示がうまく行かなくなる場合もあるので注意してください。

 

それでは($・・)/~~~
ツッコミがある方、コメントお待ちしてます。というかもっといい方法教えて~。

 

2013/01/26追記
設定で

pagespeed RewriteLevel CoreFilters;

とすると、

combine_css,extend_cache,inline_css,inline_javascript,rewrite_css,rewrite_images,rewrite_javascript

このあたりのフィルターが自動で適応されるようです。適応させたくない場合は、

pagespeed RewriteLevel PassThrough;

として、適応させたいフィルターのみ

pagespeed EnableFilters ***,***;

で設定してあげればOKです。

 

2013/03/15 追記
どうも不安定なので現在は試用を止めています。

この記事を書いた人

たぬき@首席技監

アーシタンと蔵守の技術周り担当。主にワードプレス(WordPress)、サーバ管理なんかをやっています。