昨年末に店舗を営む知人からWordPressを用いた情報発信ページの構築を依頼されていたのですが、本業の合間に少しづつ作業を進めてようやくテンプレートが完成。
「あまりお金をかけられない」ということだったので個人でも利用している「さくらのレンタルサーバ」を新たに契約してもらって設置したもののそのままではレスポンスが宜しくないので諸々のチューニングで大幅改善。
この際行った対応は特に目新しいものではありませんが、今後さくらのレンタルサーバで初めてWordPressを用いたサイトを構築される方のため、そして自分への備忘録も兼ねて効果の期待できる設定や注意点などを残しておくことにします。
.htaccessの設定
手始めに.htaccessファイルに以下を追加。
<ifModule mod_expires.c>
ExpiresActive On
ExpiresByType application/javascript "access plus 1 weeks"
ExpiresByType application/x-javascript "access plus 1 weeks"
ExpiresByType text/javascript "access plus 1 weeks"
ExpiresByType text/css "access plus 1 weeks"
ExpiresByType image/jpeg "access plus 1 weeks"
ExpiresByType image/png "access plus 1 weeks"
ExpiresByType image/gif "access plus 1 weeks"
ExpiresByType image/x-icon "access plus 1 weeks"
</ifModule>
FileETag none以前さくらのレンタルサーバではmod_expiresが使えませんでしたが、2012年7月より利用可能になっているのでありがたく活用させてもらいましょう。Expires設定を行うとブラウザは設定した期間が経過するか強制リロードを行うまでローカルキャッシュを活用するようになり、その間のページ読込み速度が大幅に改善されます。これによりサーバに掛かる負荷も軽減されるためリソースの有効な活用が図れるようになります。
ついでにEntityタグ(ETags)の生成も無効に。これによりサーバー側でのETags生成プロセスが省かれ、HTTPヘッダーサイズも微減します。
php.iniの設定
本来なら.htaccessにmod_deflateによるgzip圧縮転送の設定を利用したいのですが、現時点でさくらのレンタルサーバはmod_deflateが使えないので当面の策としてphp.iniに以下の記述を追加。さくらインターネットの「サーバコントロールパネル」より[PHP設定の編集]にて編集可能です。
zlib.output_compression=on
zlib.output_compression_level=-1これによりPHPが吐き出すコンテンツに限定されるもののgzip圧縮転送が有効になります。
なお、ここでzlib.output_compression_levelにセットしている「-1」は圧縮率をサーバ側の判断に委ねるという設定値。圧縮率に応じた「0」(圧縮しない)から「9」(最高レベルの圧縮をする) までの値を明示的に指定することも可能ですが、あまり高くしすぎると圧縮・解凍にコストがかかりすぎて逆効果となる恐れもあるのでほどほどに。(通常、1～3くらいが無理のない値だと思います)
プラグインの利用
WordPressの特徴の1つであるプラグインは種類が豊富で高速化を図ることを目的としたものも数多存在しますが、プラグインの追加により生じるオーバヘッドに見合う効果を実感できるものはそれほど多くありません。また、巷で有用とされているプラグインが用いている高速化のアプローチがWordPress本体に取り込まれず今も別個に存在しているということは何かしら問題が起きる可能性があったり万人向けではないなどの理由があるからだということも理解した上で利用する必要があります。
それを踏まえた上でも是非とも入れておきたいプラグインの1つが「Head Cleaner」。クライアント側処理の最適化を図ることで体感速度の向上を図るもので、jqueryなどのフレームワークを駆使したサイトに於いては「複数の JavaScript を結合する」「<head> 内の JavaScript を、フッタ領域に移動」などの設定を有効にしておくと多くのケースで劇的なレスポンス改善が期待出来ます。
一方であまりオススメしないのがキャッシュ系のプラグイン。下手に使うと逆にレスポンスが悪化したり表示に不具合が生じるケースもあるので、WordPress内での処理よりもサーバの応答に要するコストが相対的に高い傾向にあるさくらのレンタルサーバに於いては危険を犯してまで導入してもそれに見合うだけのメリットを享受出来るケースは少ないのではないかと思うためです。
また「WP Hyper Response」という出力バッファ制御系のプラグインも最近流行っているようですが、上で紹介したphp.iniによるgzip圧縮を有効にしている場合には意味が無いので削除しておきましょう。
画像の最適化
ページを読み込む際に生じるトラフィックの大部分はJPEGやPNG、GIFなどの画像ファイルが占めているケースがほとんどなので、これらを事前に最適化し容量を減らしておけば転送量削減によるレスポンス改善が見込めます。
最適化のやり方は色々ありますがPNG画像の場合は「TinyPNG」というWebサービスを利用すると簡単便利です。非可逆圧縮方式が採られているので画質は若干悪くなりますが、何度も繰り返して圧縮をかけるようなことでもしない限りほとんど気がつかないレベルです。
JPEGファイルの場合は「JpegTran」の利用がオススメ。こちらは可逆圧縮を行うCUIツールで内部テーブルの最適化により元画像を劣化させることなく容量削減を行います。また、JPEG画像に埋め込まれている撮影時の設定や位置情報などのEXIFも削除出来るので個人情報保護の観点からも大いに役立つツールです。コマンドライン操作が苦手な方や処理したいファイル数が多くて面倒だという方はこちらをご利用になると作業が捗るかもしれません。
さくらのレンタルサーバは一定の転送量を超過した場合に「503 Service Temporarily Unavailable」エラーが生じる仕様なので、そうした事象の発生を防ぐ意味でも画像の最適化は欠かせない対応です。
その他
さくらのレンタルサーバに限った話しではありませんが、CSS Spritesなどを駆使したHTTPリクエスト数の節減やJavaScriptの遅延実行・非同期対応など1つ1つの効果は小さくても積もり積もって大きな改善に繋がるケースもあります。また、SNS連携機能や広告などを設置したい場合にはその効果とレスポンスのバランスを見ながら必要最小限に留めるのも有用です。
サイトの表示速度を測定したり改善策を提示してくれるWebサービス「PageSpeed Insights」「GTmetrix」などから得られる情報なども参考にしながら利用者にストレスのかからないサイトを目指しましょう。
mod_deflateが使用可能に(2014-07-14)
さくらでもmod_deflateが使えるようになりました。詳しくはこちらをご参照ください。
非常に参考になります。ありがとうございました！