Wordpressのメンテナンス

高速化

クライアントからの応答速度を向上させるためのTipsです。
特にwordpressのサイトを対象にしています。

検証環境

基準

以下の評価サイトを基準に応答速度の向上を目指します。

レンタルサーバなどに設置されているwordpressを導入すると、 上記のような対策が全く行われないため、wordpressの管理者であるユーザが実施する必要があります。
そのようなメンテナの助けになれば幸いです。

圧縮を有効にする

まず最も簡単なgzipによる配信です。
配信するファイルのサイズが小さければ、通信効率があがり、応答速度の向上につながります。

Documentrootに以下のような.htaccessを設置します[参考]。

<IfModule mod_deflate.c>
SetOutputFilter DEFLATE
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch \bMSIE\s(7|8) !no-gzip !gzip-only-text/html
SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png|ico)$ no-gzip dont-vary
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/js
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/atom_xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/x-httpd-php
AddOutputFilterByType DEFLATE application/x-font-ttf
AddOutputFilterByType DEFLATE application/x-font-woff
AddOutputFilterByType DEFLATE application/x-font-opentype
</IfModule>

続いて、wordpressを使用している場合、wordpressは裏でPHPを使用しているため、
PHPが配信するデータ自体も圧縮をかける必要があります。
同じくDocumentrootにphp.iniというファイルがあると思いますので、次の設定を追加します[参考]。

zlib.output_compression = On

圧縮についてはこれでほぼ完了です。
GoogleSpeedInsightsを実行すると、圧縮を有効にするの最適化についての提案がなくなっていることでしょう。

ブラウザのキャッシュを活用する

ブラウザキャッシュを活用することで、都度サーバからファイルを配信しないようにします。

.htaccessに以下の設定を追加します[参考]。

<IfModule mod_expires.c>
ExpiresActive on
ExpiresDefault                                      "access plus 1 month"
</IfModule>

配信するファイルにもよりますが、最短でも1週間に設定にしておけばよいです[参考]。
googleMapなどをサイト内で利用していると、GoogleSpeedInsightsを実行したときに、
それらについても期限を設定しろ、と言われます。
サードパーティ製のサービスについては設定できないので、それらについてはあきらめます (ブラウザキャッシュではなくCDNを利用することで、この問題は解決できます)。

スクロールせずに見えるコンテンツのレンダリングをブロックしている JavaScript/CSS を排除する

以下のサイトが参考になります。

https://firstlayout.net/customize/speeding-up/delete-plugin-css/

説明にあるように、ブロックしているといわれたJavaScript/CSSについてinline化することで、
この問題を解決することができます。