既存の Kusanagi の Nginx にGoogle の PageSpeed モジュールを追加してみた。
PageSpeed Nginx の作成+設置方法
以下の方法は既にインストールされている nginx に PageSpeed モジュールを追加する場合に応用できる。
まず、既存の nginx の configure オプションを調べる。
# rpm -qa|g nginx
kusanagi-nginx-1.15.2-3.noarch
nginx -V
nginx version: nginx/1.15.2
built by gcc 4.8.5 20150623 (Red Hat 4.8.5-28) (GCC)
built with OpenSSL 1.0.2p 14 Aug 2018
TLS SNI support enabled
configure arguments: --conf-path=/etc/nginx/nginx.conf --add-module=./extensions/naxsi/naxsi_src --sbin-path=/usr/sbin/nginx --error-log-path=/var/log/nginx/error.log --http-log-path=/var/log/nginx/access.log --pid-path=/var/run/nginx.pid --lock-path=/var/run/nginx.lock --http-client-body-temp-path=/var/cache/nginx/client_temp --http-proxy-temp-path=/var/cache/nginx/proxy_temp --http-fastcgi-temp-path=/var/cache/nginx/fastcgi_temp --http-uwsgi-temp-path=/var/cache/nginx/uwsgi_temp --http-scgi-temp-path=/var/cache/nginx/scgi_temp --user=nginx --group=nginx --with-http_ssl_module --with-http_realip_module --with-http_addition_module --with-http_sub_module --with-http_dav_module --with-http_flv_module --with-http_mp4_module --with-http_gunzip_module --with-http_gzip_static_module --with-http_random_index_module --with-http_secure_link_module --with-http_stub_status_module --with-http_auth_request_module --with-mail --with-mail_ssl_module --with-file-aio --with-http_v2_module --with-http_image_filter_module --with-http_geoip_module --with-http_perl_module --add-module=./extensions/ngx_cache_purge --add-module=./extensions/nginx-ct --add-module=./extensions/ngx_brotli --add-module=./extensions/passenger/src/nginx_module --with-cc-opt='-O2 -g -pipe -Wp,-D_FORTIFY_SOURCE=2 -fexceptions -fstack-protector --param=ssp-buffer-size=4 -m64 -mtune=generic -I/usr/local/openssl/include' --with-ld-opt=-L/usr/local/openssl/lib --prefix=/etc/nginx
の通りにしてみる。
NPS_VERSION=1.13.35.2-stable cd wget https://github.com/apache/incubator-pagespeed-ngx/archive/v${NPS_VERSION}.zip unzip v${NPS_VERSION}.zip nps_dir=$(find . -name "*pagespeed-ngx-${NPS_VERSION}" -type d) cd "$nps_dir" NPS_RELEASE_NUMBER=${NPS_VERSION/beta/} NPS_RELEASE_NUMBER=${NPS_VERSION/stable/} psol_url=https://dl.google.com/dl/page-speed/psol/${NPS_RELEASE_NUMBER}.tar.gz [ -e scripts/format_binary_url.sh ] && psol_url=$(scripts/format_binary_url.sh PSOL_BINARY_URL) wget ${psol_url} tar -xzvf $(basename ${psol_url}) # extracts to psol/ NGINX_VERSION=1.15.3 cd wget http://nginx.org/download/nginx-${NGINX_VERSION}.tar.gz tar -xvzf nginx-${NGINX_VERSION}.tar.gz cd nginx-${NGINX_VERSION}/
## kusanagi nginx に最初から組み込まれているモジュールのソースを取ってくる。 mkdir extensions cd extensions git clone https://github.com/nbs-system/naxsi.git git clone https://github.com/grahamedgecombe/nginx-ct.git git clone https://github.com/google/ngx_brotli.git git clone https://github.com/FRiCKLE/ngx_cache_purge.git wget https://www.phusionpassenger.com/latest_stable_tarball tar xzvf latest_stable_tarball mv passenger-5.3.5 passenger cd ./extensions/ngx_brotli && git submodule update --init && cd /root/nginx-1.15.3 ln -s /usr/bin/ruby2.4 /usr/bin/ruby ln -s /usr/bin/rake2.4 /usr/bin/rake yum install curl-devel ruby rubygem-rake perl-ExtUtils-Embed ./configure --add-module=$HOME/$nps_dir ${PS_NGX_EXTRA_FLAGS} --conf-path=/etc/nginx/nginx.conf --add-module=./extensions/naxsi/naxsi_src --sbin-path=/usr/sbin/nginx --error-log-path=/var/log/nginx/error.log --http-log-path=/var/log/nginx/access.log --pid-path=/var/run/nginx.pid --lock-path=/var/run/nginx.lock --http-client-body-temp-path=/var/cache/nginx/client_temp --http-proxy-temp-path=/var/cache/nginx/proxy_temp --http-fastcgi-temp-path=/var/cache/nginx/fastcgi_temp --http-uwsgi-temp-path=/var/cache/nginx/uwsgi_temp --http-scgi-temp-path=/var/cache/nginx/scgi_temp --user=nginx --group=nginx --with-http_ssl_module --with-http_realip_module --with-http_addition_module --with-http_sub_module --with-http_dav_module --with-http_flv_module --with-http_mp4_module --with-http_gunzip_module --with-http_gzip_static_module --with-http_random_index_module --with-http_secure_link_module --with-http_stub_status_module --with-http_auth_request_module --with-mail --with-mail_ssl_module --with-file-aio --with-http_v2_module --with-http_image_filter_module --with-http_geoip_module --with-http_perl_module --add-module=./extensions/ngx_cache_purge --add-module=./extensions/nginx-ct --add-module=./extensions/ngx_brotli --add-module=./extensions/passenger/src/nginx_module --with-cc-opt='-O2 -g -pipe -Wp,-D_FORTIFY_SOURCE=2 -fexceptions -fstack-protector --param=ssp-buffer-size=4 -m64 -mtune=generic -I/usr/local/openssl/include' --with-ld-opt=-L/usr/local/openssl/lib --prefix=/etc/nginx cp -af /usr/sbin/nginx /usr/sbin/nginx.org.kusanagi # バックアップしておく make make install
以上で新しいNginx+ PageSpeed ができた。
kusanagi /usr/sbin/nginx が入れかわった。
設定ファイルの編集
/etc/nginx/nginx.conf の http セクション内の最後の方に挿入追記する。
http {
pagespeed UsePerVhostStatistics on; pagespeed FileCachePath "/var/cache/nginx/ngx_pagespeed"; pagespeed MessageBufferSize 100000;
pagespeed GlobalAdminPath /pagespeed/pagespeed_global_admin;
pagespeed GlobalStatisticsPath /pagespeed/ngx_pagespeed_global_statistics;
pagespeed StaticAssetPrefix /pagespeed/pagespeed_static;
}
/etc/nginx/conf.d/mydomain_ssl.conf の server セクションに次を挿入する。
server { pagespeed On;
pagespeed FileCachePath "/var/cache/nginx/ngx_pagespeed";
pagespeed EnableFilters collapse_whitespace,trim_urls,remove_comments;
pagespeed StatisticsPath /pagespeed/ngx_pagespeed_statistics;
pagespeed MessagesPath /pagespeed/ngx_pagespeed_message;
pagespeed ConsolePath /pagespeed/pagespeed_console;
pagespeed AdminPath /pagespeed/pagespeed_admin;
pagespeed BeaconUrl /pagespeed/ngx_pagespeed_beacon;
pagespeed Statistics on;
pagespeed StatisticsLogging on;
pagespeed LogDir /var/log/pagespeed;
pagespeed Domain *;
pagespeed Domain *.com;
pagespeed EnableCachePurge on;
location /pagespeed/ {
auth_basic "Restricted"; # 認証時に表示されるメッセージ
auth_basic_user_file /pagespeed/.htpasswd; # .htpasswdファイルのパス
}
# Ensure requests for pagespeed optimized resources go to the pagespeed handler
# and no extraneous headers get set.
location ~ "\.pagespeed\.([a-z]\.)?[a-z]{2}\.[^.]{10}\.[^.]+" {
add_header "" "";
}
location ~ "^/pagespeed_static/" { }
location ~ "^/ngx_pagespeed_beacon$" { }
}
* https://mydomain.npn/pagespeed/pagespeed_admin/
にアクセスすると、現在の設定状況、統計情報などが表示される。
今現在、次のフィルターが有効になっている。
Version: 14: on Filters ah Add Head cw Collapse Whitespace cc Combine Css jc Combine Javascript gp Convert Gif to Png jp Convert Jpeg to Progressive jw Convert Jpeg To Webp mc Convert Meta Tags pj Convert Png to Jpeg ws When converting images to WebP, prefer lossless conversions ec Cache Extend Css ei Cache Extend Images es Cache Extend Scripts fc Fallback Rewrite Css if Flatten CSS Imports hw Flushes html ci Inline Css ii Inline Images il Inline @import to Link ji Inline Javascript js Jpeg Subsampling tu Left Trim Urls rj Recompress Jpeg rp Recompress Png rw Recompress Webp rc Remove Comments ri Resize Images cf Rewrite Css jm Rewrite External Javascript jj Rewrite Inline Javascript cu Rewrite Style Attributes With Url cp Strip Image Color Profiles md Strip Image Meta Data
WordPress の Autoptimize プラグインで、css と JavaScript を最適化した後に、この pagespeed を on にしている。
html のソースを見ると、かなり変換されているようであるが、実際に高速化されているのかはよくわからない。
背景画像が表示されていない時
背景画像が jpeg から .webp に変換されていて、not found で表示されない頁があった。
それでその頁のキャッシュを一度削除したらよくなった。
pagespeed EnableCachePurge on;
にしないといけない。
* https://mydomain.npn/pagespeed/pagespeed_admin/cache#purge_cache
でキャッシュをパージ Purge 除去できる。
どうやら、ブラウザが chrome の時だけ .jpeg が.webp に変換される場合があるようだ。
全部の画像が変換されるわけではない。
確かに画像サイズは小さくなっている。が not found にはなってほしくない。
使用停止
その後、WPP(Wordpress Popular Post)の画像などが表示されていないことに気付き、
pagespeed Off;
にした。
Webmin でシステムアップデートの時に kusanagi-nginx だけアップデートしないようにしたのだが、依存性の問題で勝手にアップデートされてしまった。
それでもとの pagespeed なしのnginxに戻った。
そうなると設定ファイルから pagespeed 関連の行を總て削除しないと nginx は起動しない。
pagespeed-nginx は kusanagi-nginx の10倍の大きさがある。
-rwxr-xr-x 1 root root 4.3M Oct 10 09:55 /usr/sbin/nginx -rwxr-xr-x 1 root root 42M Sep 25 14:05 /usr/sbin/nginx.pagespeed
pagespeed の設定で画像だけを置換しないように設定することもできるのだが、今は元に戻したままにしておく。