ようやくFC2からWordPressへの移転も終わりました。こちらのブログの見かけも最近多すぎなStinger3からオリジナルっぽい感じにできた思っています。それに伴って、今回は色々とWordPressの高速化をしてみたのでまとめてみます。

遅い・・・

FC2からWordPressへ引っ越した感想

最初は慣れなくて難しいですね。サーバーはロリポップ!のチカッパプランなのですが、ちょっとレスポンスがFC2の時よりも遅い感じがします。なんか画面が表示されるまでに1テンポ待たされるというか。まあ、表示された後のソーシャルボタン等の外部の非同期な呼び出しに時間がかかるのは同じですね。

そこで、もう少し速くできないかなと思って、色々とWordPressの高速化をしてみました。

ロリポップサーバーの設定

PHP

バージョン

PHPは最新のバージョンのほうが速いらしいです。デフォルトで5.3になっていたので、5.4にしました。

apc

apc関連を有効にしました。apc.enabledとapc.enable_cliを1にしました。

.htaccessの設定

.htaccessファイルを修正して、キャッシュと有効期限(expire)の設定、ETagの無効化をしました。

<Files ~ ".(gif|jpe?g|png|ico|js)$">
Header set Cache-Control "max-age=2592000"
</Files>

<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access 1 year"
ExpiresByType image/jpeg "access 1 year"
ExpiresByType image/gif "access 1 year"
ExpiresByType image/png "access 1 year"
#ExpiresByType text/css "access 1 month"
ExpiresByType application/pdf "access 1 month"
ExpiresByType text/x-javascript "access 1 month"
ExpiresByType application/javascript "access 1 month"
ExpiresByType application/x-javascript "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 2 days"
</IfModule>

<Files ~ ".(css|js|html?|xml|gz)$">
FileETag MTime Size
</Files>
<Files ~ ".(gif|jpe?g|png|flv|mp4|ico)$">
FileETag None
</Files>

WordPressのプラグイン

WordPressのプラグインはキャッシュ関係など色々あると思いますが、私の場合は、プラグイン入れるほど重くなってきた気がしたので、できる限りプラグインを入れないようにしました。

WordPress Popular Postなどのユーザビリティーに関わるものや、セキュリティー、バックアップ関連などに絞ってます。
→追記:WordPress Popular Postも外して、手動でおすすめ記事のリンクを貼るようにしました。

でも、MO CacheとWP-DBManagerは入れてますね。MO CacheはWordPress日本語翻訳のキャッシュ設定、WP-DBManagerはDBの最適化をしてくれます。
※MO Cacheは止めました。キャッシュのプラグインを入れておかないといけないようなので。

wp-config.phpの設定

プラグインでキャッシュ関連を入れていない代わりにwp-config.phpに設定しています。

キャッシュの有効化、投稿のリビジョンを記録しない、WordPressのメモリ量を128Mに増加をしています。
define('WP_CACHE', true);
define('WP_POST_REVISIONS', false);
define('WP_MEMORY_LIMIT', '128M');

HTML、CSSのカスタマイズ

javascript読み込み

cssを先にjavascriptは後ろで読み込ませるようにしました。あとはjavascriptはできるだけ非同期で読み込ませるようにしています。

CSSの圧縮

CSSはscssファイル化してます。scssからcssに変換するときに一番圧縮されるモードの引数(–style compressed)を付けてコンパイルしています。だいぶファイルサイズが変わりますよ。

圧縮すると、人間には見づらいですが、自分が見るときは変換前のscssファイルしか見ないので、まあ大丈夫です。

画像の圧縮

png画像の圧縮もしています。フリーで圧縮できるサイトがあるので使っています。
TinyPNG – Compress PNG images while preserving transparency

終わりに

きちんと計測しながらやったわけではないのですが、少し速くなった気がします。一番大きかったのは余計なプラグインを入れないことだと思います。

これからも、ユーザにとっても使いやすく、SEO的にも良くするために、気がついたことは少しでも高速化していきたいですね。