ハイパフォーマンス WordPress サイト入門

まずは、現状分析してボトルネックを探りましょう。
現状分析には Debug Bar と Debug Bar Extendar プラグインが便利です。

• http://wordpress.org/extend/plugins/debug-bar/
• http://wordpress.org/extend/plugins/debug-bar-extender/

インストールしたら wp-config.php に以下の3行を追加します。

define('SAVEQUERIES', true);
define('WP_DEBUG', true);
define('WP_DEBUG_DISPLAY', false);

どのプラグインがボトルネックになっているかを探るには Debug Bar と Debug Bar Extendar が便利です。
これを導入して管理バーに表示されるメニュー「Debug」を見ることで、ある程度特定できます。

<?php
if (class_exists('Debug_Bar_Extender')
  Debug_Bar_Extender::instance()->checkpoint('loop start');
?>

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
 
# END WordPress

例えば、以下のファイルなんかは、ブラウザやクローラからファイルの有無を確認されることが多いです。

• /favicon.ico
• /apple-touch-icon.png
• /robots.txt
• /crossdomain.xml

これらは、あらかじめ用意しておいたほうが良いですね。

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME}
	 !\.(html?|xml|txt|xsl|js|css|jpe?g|png|gif|ico)$
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
 
# END WordPress

マルチサイト版の子サイトでは、画像の URL が以下のような感じになりますが

http://hoge.example.com/files/2011/05/fuga.jpg

実際にはサーバ上には /files/2011/05/fuga.jpg ってファイルは存在してません。

Web サーバとして Apache を採用していて、子サイトのサイト名が hoge.example.com で、ブログIDが2の場合。

RewriteEngine On
RewriteCond %{HTTP_HOST} ^hoge\.example\.com$
RewriteRule ^(/files/.+) %{HTTP_HOST}$1 [C]
RewriteRule ^hoge\.example\.com(/files/.*)
	/wp-content/blogs.dir/2$1 [L]

ただし、子サイトを追加したりした場合は、都度 .htaccess を手で修正してやらなければならないので注意が必要です。

Apache の .htaccess に書くなら、こんな感じ。

<IfModule mod_expires.c>
ExpiresActive On
ExpiresDefault "access plus 1 seconds"
ExpiresByType text/html "access plus 1 seconds"
ExpiresByType image/gif "access plus 2592000 seconds"
ExpiresByType image/jpeg "access plus 2592000 seconds"
ExpiresByType image/png "access plus 2592000 seconds"
ExpiresByType image/x-icon "access plus 2592000 seconds"
ExpiresByType text/css "access plus 604800 seconds"
ExpiresByType text/javascript "access plus 604800 seconds"
ExpiresByType application/x-javascript "access plus 604800 seconds"
</IfModule>

深い階層のサブディレクトリ内を見られたとき Apache は、全ての親ディレクトリをたどって継承元となる .htaccess が無いか確認し、あればマージします。

もし、Apache を使用していて httpd.conf が修正できる場合は、これらの設定はすべて httpd.conf で行い .htaccess は使用しないようにした方が賢明です。

それらを削ってチューニングしていっても良いのですが、さらに軽量でチューニングも容易な lighttpd や Nginx で運用することも検討してみてはどうでしょうか？

公式サイトの文書も、先日「め組」のたいさんと私が日本語訳しました。

• http://nginx.org/ja/
• http://nginx.org/ja/docs/

Nginx なら、わりと簡単にスケールアウトさせることができます。
例えば、バックエンドのアプリケーションサーバ(192.168.0.2:8000) を追加した場合、こんな感じです。

http {
   ：
    upstream backend {
        ip_hash;
        server 127.0.0.1:8000;
        server 192.168.0.2:8000;
    }

    server {
        listen       80;
        server_name  _;
        root    /var/www/html;
        index   index.php index.html index.htm;
        location ~ .*\.php { proxy_pass http://backend; }
        location ~ /\.ht { deny  all; }
        location ~ .*\.(txt|xml|html?|js|css|gz|ico|jpe?g|gif|png|wmv|flv|swf|mpg) {
            access_log  off;
            expires 30d;
            break;
        }
        location / { proxy_pass http://backend; }
    }
   ：
}

WordPress がインストールされているディレクトリ内のファイルの同期には lsyncd 辺りを使えば良いでしょう。

lsyncd は linux kernel 2.6.13 で導入された iNotify という API を使って動作しています。
この API を使うと、ファイルの作成や削除などをそれぞれイベントとして取得することができます。
lsyncd では、この API と rsync を組み合わせてリアルタイムなファイル同期を実現しています。

詳細な設定方法は、僕とこのブログで解説してます。

http://dogmap.jp/EI

WordPress は PHP で記述されたアプリケーションです。
PHP は、実行するたびにソースから中間コードを生成しています。
eAccelerator や APC は、この中間コードをキャッシュして PHP の処理速度自体を高速化してくれます。

インストール方法とかは、そこら中に情報転がってると思うので割愛。
動作しているか確認するには php -i で確認しましょう。

eAccelerator の場合は

$ php -i | grep eAccelerator
    with eAccelerator v0.9.6.1, Copyright (c) 2004-2010 eAccelerator, by eAccelerator
eAccelerator
eAccelerator support => enabled

APC の場合は

$ php -i | grep apc
apc
apc.cache_by_default => On => On
apc.canonicalize => On => On
apc.coredump_unmap => Off => Off
apc.enable_cli => Off => Off
apc.enabled => On => On
apc.file_md5 => Off => Off
apc.file_update_protection => 2 => 2
apc.filters => no value => no value
apc.gc_ttl => 3600 => 3600
apc.include_once_override => Off => Off
apc.lazy_classes => Off => Off
apc.lazy_functions => Off => Off
apc.max_file_size => 1M => 1M
apc.mmap_file_mask => no value => no value
apc.num_files_hint => 1000 => 1000
apc.preload_path => no value => no value
apc.report_autofilter => Off => Off
apc.rfc1867 => Off => Off
apc.rfc1867_freq => 0 => 0
apc.rfc1867_name => APC_UPLOAD_PROGRESS => APC_UPLOAD_PROGRESS
apc.rfc1867_prefix => upload_ => upload_
apc.rfc1867_ttl => 3600 => 3600
apc.shm_segments => 1 => 1
apc.shm_size => 32M => 32M
apc.slam_defense => On => On
apc.stat => On => On
apc.stat_ctime => Off => Off
apc.ttl => 0 => 0
apc.use_request_time => On => On
apc.user_entries_hint => 4096 => 4096
apc.user_ttl => 0 => 0
apc.write_lock => On => On 

eAccelerator の場合、php.ini に以下を追加

eaccelerator.check_mtime='0'

APC の場合、php.ini に以下を追加

apc.stat=FALSE

ただし、これやると WordPress でテーマファイル修正したとか、WordPress 本体とかプラグインとかアップデートしたときに中間コードのキャッシュを自動で再作成してくれません。

そんな時は、手動でキャッシュを消すことを忘れずに。

Debug Bar で、見てみましょう。一目瞭然ですね。

WordPress のパフォーマンスチューニングで、以下のような手法が紹介されることが多いと思います。

<?php bloginfo('stylesheet_url') ?>

上のようなテンプレートタグは MySQL サーバにアクセスして遅くなるので、直接書いておけ。

http://example.jp/wp-content/themes/example/style.css

global $memcached_servers;
$memcached_servers = array('192.168.0.2:11211');

※別サーバが 192.168.0.2 で memcached のポートが 11211 の場合
 複数サーバを指定することもできます。

nginx.conf にこんな感じで記述します。

http {
  :
  proxy_cache_path  /var/cache/nginx levels=1:2 keys_zone=czone:32m max_size=256m inactive=120m;
  proxy_temp_path   /var/tmp/nginx;
  proxy_cache_key   "$scheme://$host$request_uri$is_args$args";
  proxy_set_header  Host               $host;
  proxy_set_header  X-Real-IP          $remote_addr;
  proxy_set_header  Remote-Addr        $remote_addr;
  proxy_set_header  X-Forwarded-Host   $host;
  proxy_set_header  X-Forwarded-Server $host;
  proxy_set_header  X-Forwarded-For    $proxy_add_x_forwarded_for;
  client_max_body_size 50m;
  client_body_buffer_size 256k;
  proxy_connect_timeout 30;
  proxy_send_timeout 30;
  proxy_read_timeout 60;
  :

server {
  :
  location / {
    if ($http_cookie ~* "comment_author_[^=]*=([^%]+)%7C|wordpress_logged_in_[^=]*=([^%]+)%7C") {
      set $do_not_cache 1;
    }

    proxy_no_cache     $do_not_cache;
    proxy_cache_bypass $do_not_cache;

    proxy_redirect off;
    proxy_cache czone;
    proxy_cache_key "$scheme://$host$request_uri$is_args$args";
    proxy_cache_valid  200 10m;
    proxy_cache_valid  404 5m;
    proxy_pass http://backend;
  }
}

こんな感じですね。

if ($http_user_agent ~* '(DoCoMo|J-PHONE|Vodafone|MOT-|UP\.Browser|DDIPOCKET|ASTEL|PDXGW|Palmscape|Xiino|sharp pda browser|Windows CE|L-mode|WILLCOM|SoftBank|Semulator|Vemulator|J-EMULATOR|emobile|mixi-mobile-converter)') {
  set $mobile 1;
}
if ($http_user_agent ~* '(iPhone|iPod|Opera Mini|Android.*Mobile|NetFront|PSP|BlackBerry|Windows Phone)') {
  set $mobile 2;
}
:
proxy_cache_key "$scheme://$host$request_uri$is_args$args$mobile";

総発行クエリー数は Debug Bar の Queries タブで確認できます。

プラグインで解決できる場合もあります。

DB Cache Reloaded Fix は SQL クエリーの結果をディスクにキャッシュしてくれるプラグインです。

• DB Cache Reloaded Fix

日本語リソースは僕が作ったんで、もしおかしな訳を見つけたら、こっそり教えてください。

MySQLTuner をダウンロードしましょう。

$ wget mysqltuner.pl

余談ですが、これ面白いすよね。
http://mysqltuner.pl/ を http://mysqltuner.pl/mysqltuner.pl に302リダイレクトすることによって
「wget mysqltuner.pl」だけで mysqltuner.pl をダウンロードできるようにしてる。

$ perl mysqltuner.pl

 >>  MySQLTuner 1.2.0 - Major Hayden 
 >>  Bug reports, feature requests, and downloads at http://mysqltuner.com/
 >>  Run with '--help' for additional options and output filtering
Please enter your MySQL administrative login: xxxxxx
Please enter your MySQL administrative password:

-------- General Statistics --------------------------------------------------
[--] Skipped version check for MySQLTuner script
[OK] Currently running supported MySQL version 5.5.15-log
[OK] Operating on 32-bit architecture with less than 2GB RAM

  :
  :
-------- Recommendations -----------------------------------------------------
General recommendations:
    Run OPTIMIZE TABLE to defragment tables for better performance
    MySQL started within last 24 hours - recommendations may be inaccurate
    When making adjustments, make tmp_table_size/max_heap_table_size equal
    Reduce your SELECT DISTINCT queries without LIMIT clauses
Variables to adjust:
    tmp_table_size (> 48M)
    max_heap_table_size (> 48M)

クライアント側で重くなる原因は、データ量が多いとか色々考えられます。
この辺は「ハイパフォーマンス Web サイト」を読みましょう。

サーバサイドのチューニングの時にも紹介しましたが、Apache なら mod_expires を使いましょう。
Nginx なら、expires xxd って書いてあげるだけでよいです。

http {
 ：
  server {
    listen 80;
    server_name  _;
    root    /var/www/html;
    # static files
    location ~ .*\.(txt|xml|html?|jpe?g|JPE?G|gif|GIF|png|PNG|swf|SWF|wmv|WMV|flv|FLV|css|CSS|js|JS|inc|ico|gz) {
      index   index.html index.htm;
      expires 14d;
      break;
    }
 ：
  }
 ：
}

Apache なら mod_deflate を使いましょう。

<IfModule mod_deflate.c>
SetOutputFilter DEFLATE
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSI[E] !no-gzip !gzip-only-text/html
SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png|ico)$ no-gzip dont-vary
SetEnvIfNoCase Request_URI _\.utxt$ no-gzip
#DeflateCompressionLevel 4
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/atom_xml
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/x-httpd-php
</IfModule>

Nginx なら、こんな感じ。

http {
 ：
  gzip              on;
  gzip_http_version 1.0;
  gzip_vary         on;
  gzip_comp_level   6;
  gzip_types        text/html text/xml text/css application/xhtml+xml application/xml application/rss+xml application/atom_xml application/x-javascript application/x-httpd-php;
  gzip_disable      "MSIE [1-6]\.";
 ：
}

僕の作ったプラグイン Head Cleaner が役に立つかもしれません。

• Head Cleaner

また、以下のサイトでは、JavaScript を Minify してくれます。

• http://jscompress.com/

jQuery を使用しているプラグインがある場合、テーマに直接

<script type='text/javascript' src='http://example.com/js/jquery.js'>
</script>

とかって書いておくと、jQuery が複数呼び出される場合があります。

そういうときは、テーマテンプレートの header.php の冒頭に

<?php wp_enqueue_script('jquery'); ?>

と書いておくだけで良いです。

ただし、古いプラグインや行儀の悪いプラグインが、直接 head 部にスクリプトを書き出しているかもしれません。
これは修正してあげましょう。

CDN を使って静的ファイルを配信するには、以下のプラグインが役に立つかもしれません。

• Amazon S3 for WordPress

これを使うことによって、静的ファイルを Amazon の CloudFront から配信することができます。

また、手っ取り早く jQuery だけ Google AJAX Libraries のモノを使わせることもできます。
テーマテンプレートの header.php の冒頭に、以下のように書いておきましょう。

<?php
wp_deregister_script('jquery');
wp_enqueue_script(
  'jquery',
  'http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js',
  array(),
  '1.6.1');
?>