WordPressメモ-画像のリンク切れが原因でサイトが重くなる-

logw_title_wordpress_logo

WordPressメモの更新になります。今回は皆大好きWordPressの画像のリンク切れについてになります。

リンク切れ放置していませんか?

リンク切れしていないかなー

トップページ(home.php又はindex.php)や記事(single.php)に画像のリンクがあったとします。画像なので一度はめ込んでしまえば特に変更などは行いません。しかし設定変更や画像の変更でちょっと間違えてしまったとします。その時リンク切れが置きます。このリンク切れを放置するとちょっと大変な事になります。

リンク切れを放置するとどうなる?

WordPressの場合、リンク切れを起こすと404ページが表示されます。これはサーバー側でWordPressを起動して404を表示してねというプロセスが立ち上がっていることになります。

このプロセスが立ち上がるとどうなるかというと、サーバーに負荷をかけます。リンク切れが少なければいいですが、例えば1000の記事があり、一つに必ず一個リンク切れがあれば1000のリンク切れがおきます。(実際に1000の記事を同時に表示すると言うことはないのと、Apacheで同時接続数などの設定が可能でやはりアクセスはできません。)ちょっと図をつけてみます。

img_imagelink
↑こんな感じです。

画像4つにリンクが切れていた場合、WordPressが起動して404を表示するということになります。実際に確認をしてみたいと思います。

確認

logwの見出しで使っている画像を非表示にしてみたいと思います。まずは画像を表示した状態です。

img_wordpressmemo
※画像はクリックで拡大します。

WordPressのロゴと人物写真が表示された状態での読み込み速度を見て見たいと思います。

表示速度が見える・・・
※画像はクリックで拡大します。

実際に表示にかかった時間はロゴ画像、人物写真共に97ミリ秒です。(1ミリ秒=1000分の1秒です)

次に画像を非表示にしてみたいと思います。(拡張子を変えてリンク切れの状態にします。)

img_broken_link
※画像はクリックで拡大します。

非表示にしました。このときのサーバーの処理を見て見たいと思います。

img_check_link002
※画像はクリックで拡大します。

404になったとたんロゴ画像が339ミリ秒、人物写真で511ミリ秒となりました。画像のリンク切れがあるだけで読み込み時間が変わりました。

WordPressが起動しているのが原因

この原因としてはWordPressが起動しているのが原因となります。方法としては画像などのリンク切れをしないのが一番ベストですが、実際問題全てのリンクをチェックするのはページ数が多くなればなるほど不可能に近いです。

リンク切れをしたままでも表示を軽くするには、もう一つの方法を使います。それはWordPressを起動しない方法をとります。重くなる原因はWordPressの多重起動になるため、画像やPDFといったようなファイルには起動しない。つまり除外設定をします。

リンク除外の方法

.htaccessに以下のルールを追記します。

RewriteCond %{REQUEST_URI} !\.(gif|css|js|swf|jpg|jpeg|png|ico|swd|pdf)$

追記場所はどこでもいいですが、僕はこんな中間に記述しました。

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} !\.(gif|css|js|swf|jpg|jpeg|png|ico|swd|pdf)$
RewriteRule . /index.php [L]
</IfModule>

こんな感じになります。追記したらアップロードします。.htaccessはWordPressのドキュメントルートにデフォルトでは設定してください。

.htaccessを変更した状態で確認

リンク切れしていないかなー

実際に404のままどれくらい軽くなったか見て見たいと思います。

img_check_link003
※画像はクリックで拡大します。

404のままですが、見事に軽くなりました。ロゴ画像で85ミリ秒、人物写真で93ミリ秒までになりました。WordPressの.htaccessに一文追加するだけで良いので是非ためしてみてください。