WordPressの速度向上

WordPressめも

WordPressはプラグインも豊富で便利ですが、使っていて遅いな。と思うことが多々あります。
なんとかならんものかと試してみました。

HTML, CSS, JavaScriptを縮小する †

Autoptimize プラグインをインストールします。
プラグインを有効化するだけでなく、設定が必要になります。

Webフォントの利用を停止する †

Googleが提供しているWebフォントの利用を停止することで速度向上が期待できます。
Disable Google Fonts プラグインをインストールします。

CSSやJavaScriptファイルに付与されている文字列を削除する †

応答速度の向上が期待されるので、Remove Query Strings From Static Resources プラグインをインストールします。

画像を最適化する †

画像をロスレス圧縮すると転送量を抑えることができるため、速度向上が期待できます。
ロスレス圧縮とは可逆圧縮とも言われ、圧縮しても展開しても同じデータ量になるというものです。

EWWW Image Optimizer プラグインをインストールします。
次回からの画像アップロードで自動的に最適化されます。
アップロード済みのものは メディア - Bulk Optimize から一括で最適化処理を実行することができます。

キャッシュを有効化する †

WEBサーバにApacheを利用している場合、キャッシュを有効化します。

mod_expires.so が有効になっていることを確認して、.htaccess にキャッシュするコンテンツタイプと期限を記述します。

ExpiresActive On
ExpiresDefault "access plus 30 minutes"
ExpiresByType text/html "access plus 10 seconds"
ExpiresByType image/jpg "access plus 7 days"
ExpiresByType image/jpeg "access plus 7 days"
ExpiresByType image/gif "access plus 7 days"
ExpiresByType image/png "access plus 7 days"
ExpiresByType text/css "access plus 1 month"
ExpiresByType application/pdf "access plus 1 month"
ExpiresByType text/x-javascript "access plus 1 month"
ExpiresByType application/javascript "access plus 1 month"
ExpiresByType application/x-javascript "access plus 1 month"
ExpiresByType application/x-shockwave-flash "access plus 1 month"
ExpiresByType image/svg+xml "access plus 1 year"
ExpiresByType image/x-icon "access plus 1 month"

コンテンツを圧縮する †

WEBサーバにApacheを使用している場合、コンテンツを圧縮して高速化を図ります。

mod_filter.so と mod_deflate.so が有効になっていることを確認して .htaccess に圧縮するコンテンツタイプを記述します。

FilterDeclare Compression CONTENT_SET
FilterProvider Compression DEFLATE "%{CONTENT_TYPE}='text/html'"
FilterProvider Compression DEFLATE "%{CONTENT_TYPE}='text/xml'"
FilterProvider Compression DEFLATE "%{CONTENT_TYPE}='text/css'"
FilterProvider Compression DEFLATE "%{CONTENT_TYPE}='text/plain'"
FilterProvider Compression DEFLATE "%{CONTENT_TYPE}='image/svg+xml'"
FilterProvider Compression DEFLATE "%{CONTENT_TYPE}='application/xhtml+xml'"
FilterProvider Compression DEFLATE "%{CONTENT_TYPE}='application/xml'"
FilterProvider Compression DEFLATE "%{CONTENT_TYPE}='application/rdf+xml'"
FilterProvider Compression DEFLATE "%{CONTENT_TYPE}='application/rss+xml'"
FilterProvider Compression DEFLATE "%{CONTENT_TYPE}='application/atom+xml'"
FilterProvider Compression DEFLATE "%{CONTENT_TYPE}='text/javascript'"
FilterProvider Compression DEFLATE "%{CONTENT_TYPE}='application/javascript'"
FilterProvider Compression DEFLATE "%{CONTENT_TYPE}='application/x-javascript'"
FilterProvider Compression DEFLATE "%{CONTENT_TYPE}='application/x-font-ttf'"
FilterProvider Compression DEFLATE "%{CONTENT_TYPE}='application/x-font-otf'"
FilterProvider Compression DEFLATE "%{CONTENT_TYPE}='font/truetype'"
FilterProvider Compression DEFLATE "%{CONTENT_TYPE}='font/opentype'"
FilterChain Compression

AddOutputFilterByTypeによる記述は非推奨となっているようです。
またFilterProviderの記述方法はApache2.2系と2.4系で異なるようなので注意が必要です。
上記の記述は2.4系になります。

対策結果 †

上記の対策の結果、PageSpeed Insightsでのポイントは以下のように向上しました。