【重い】遅いWordPressの高速化方法【プラグイン、画像圧縮など】

2021年7月14日

書いた人:TATSUO IYAMA

TATSUO Microsoft、KDDIのサポセン(表彰歴)、Androidアプリの開発などIT歴20年。猛毒親育ち。歌手はいだしょうこさんを絶賛。

ダークソウル3レベル1縛りカンスト周回クリア
Fall Guys メインショーソロ5連勝達成

砂時計

 

「ページの表示が遅すぎてユーザーがイライラしてそう( ^ω^)・・・」

「サイトが異常に遅い原因を追究したい」

 

ページの表示は1秒でも早いほうがいいですよね。

すでにいくつか試している人も見落としがないか見ていきましょう!

すべての作業前にはバックアップを!

バックアップ

まだの方はWordPressの「UpdraftPlus」プラグインなどを使いましょう。

目標は3秒以内にページを表示させること

ページの表示に3秒かかると53%のユーザーが離脱すると言われています。

3秒でおよそ半分って大きいですね。

世の中せっかちな人が多いんやなー
タマ
タマ

王道!画像の圧縮

コンプレッサー

もし初めて画像の圧縮をするなら効果が絶大です。

会員登録不要で制限がないお手軽なプラグインを選んでもよし、

少しの手間とお金をかけてもよければ圧縮率が高いプラグインを選んでもよしです。

シロ
シロ
ラクチンですね!

下記の表にあるプラグインならキレイに圧縮してくれますよ。

プラグイン 圧縮率 無料版での制限 会員登録
EWWW Image Optimizer 特になし 不要
WP Smush 特になし 不要
Imagify 50MB/月 必要
Compress JPEG & PNG images 500枚/月 必要
ShortPixel 50枚/月 必要

PNGをJPGに変換してみる

JPGは背景の透過がないため注意してください!

いちおうサイトの背景を白にすることで透過しているように見えます。

PNGをJPGに変えることでファイルサイズが小さくなるケースが多いです。

シロ
シロ
ものによりますけどね

ゲムオタブログでもほとんどJPGに変換しています。

TATSUO
TATSUO
表示早いでしょ?

一括変換したければ「PNG to JPG」という便利なプラグインがあります。

PNG to JPG

WordPress左側の「プラグイン」から「新規追加」を開き「png to jpg」と検索。

インストールと有効化をします。

有効化したら画面左側の「メディア」から「PNG to JPG」を開きましょう。

png-to-jpg2

各種設定

JPG quality ファイルサイズ優先なら下げ、画質にこだわるなら100%にしましょう
Convert PNG to JPG during upload ファイルアップロード時にPNGをJPGにするか
Only convert image if JPG filesize is lower than PNG filesize PNGよりJPGのファイルサイズが小さければ変換。もちろんON
Leave original PNG images on the server もともとのPNGファイルをサーバーに残すか
Autodetect transparency for existing PNG images 既存のPNGファイルに透過処理をするか

設定がおわったら「Convert existing PNGs」タブを開きましょう。

png-to-jpg3

自動的にPNGファイルが検索されますから、変換したいファイルを選び「Convert selected PNGs」をクリックすると変換が始まります。

ちなみに

 

「Select all transparent PNGs(すべての透過PNGを選ぶ)」

「Select all non-transparent PNGs(すべての非透過PNGを選ぶ)」

 

というボタンもありますよ。

あとは作業完了を待つだけ!

シロ
シロ
ラクチンでありがたいですね!

不要なプラグインを削除する

歯車

いったんすべてのプラグインを停止させてみてページの表示速度がアップすれば、プラグインを見直す価値があります。

ページを遅くしているプラグインを特定できたら削除か別のプラグインを検討します。

プラグイン不要で実現できる方法があれば探すのもよいでしょう。

探し方は例えばGoogleで

「WordPress 人気の記事 プラグイン 不要」

といったワードで検索すると出てきます。

不要なプラグインを削除すればプログラムがシンプルになりエラーの頻度も減りますから一石二鳥ですね。

PHPのバージョンを上げる

アップ

PHPのバージョンを上げるだけでスピードアップが期待できます。

PHP7 は、PHP5 に比べ2倍以上の実行速度を誇り、
メモリ使用量が大幅に改善されたPHPの最新バージョンです。

出典:XSERVER

バージョンを上げる方法はサーバーの管理画面で行います。

運営会社によって異なるため、Google検索で調べましょう。

たとえば、

 

「XSERVER PHP バージョン」

「さくらインターネット PHP バージョン」

 

で検索するとバージョンアップ手順がヒットします!

TATSUO
TATSUO
ゲムオタブログも速度2倍になってビックリしました!

サーバーを変える

サーバーの応答速度

出典:ビズサバ

より料金の高いサーバーへ移行すれば高速化が望めます。

「今契約しているサーバーは速いの?」

と思ったらたとえばGoogle検索で、

 

「XSERVER 遅い」

「XSERVER 評判」

「XSERVER 速度」

 

といったワードで検索すると、今契約しているサーバーの速度がだいたいわかります。

ちなみにこのブログではコアサーバーを使用しています。

サーバー間とのデータを圧縮する

圧縮

最近のブラウザでは「Gzip」と呼ばれる圧縮技術に対応しています。

ブラウザとサーバー間のデータを圧縮することで、高速化が期待できます!

手順

FTPでサーバーに接続すると、サーバーの一番上の階層(ルートディレクトリ)に「.htaccess」というファイルがあります。

いったんダウンロードし、次のコードを追記してアップロードします。

※バックアップをお忘れなく!

アップロードさえすればあとは自動的に圧縮されています。

jQueryのカスタマイズをしてみる

道具

編集は子テーマで

現在使用しているメインテーマを直接編集してもテーマのバージョンアップをしたとき、せっかく行ったカスタマイズがリセットされてしまいます。

子テーマの導入についてはGoogle検索で、「(使用しているテーマの名前) 子テーマ」で検索すると出てきます。

jQueryのCDN(コンテンツデリバリネットワーク)を利用する

コンテンツデリバリネットワークを用いることにより、ウェブのみならず、大容量アプリケーション、音楽、動画の配信やオンラインゲームといったブロードバンドのコンテンツを配信することが安定かつ低コストで行えるようになる。

出典:Wikipedia

手順

WordPress管理画面の左ペインから「外観」->「テーマエディター」を開きます。

functions.phpに次のコードを追記します。

※バックアップをお忘れなく!

jQuery migrateを削除してみる

【手順】

WordPress管理画面の左ペインから「外観」->「テーマエディター」を開きます。

functions.phpに次のコードを追記します。

※バックアップをお忘れなく!

jQuery migrateは、新旧バージョンのjQueryに互換性を持たせるための機能です。

ただし古いバージョンのjQueryが現在ではほとんど使われていないです。

TATSUO
TATSUO
このブログでも削除しています。

ためしにjQuery migrateを削除してみてページの表示速度が上がり、不具合が起きないようであれば実行する価値があります。

高速なテーマに変えてみる

 

「めんどうなことはイヤだ」

「いろいろ試したけど結局変わらない・・・」

 

という方はテーマを切り替えてしまうのもひとつの方法です。

高速なテーマと言えばコクーンや、ゲムオタブログでも使用中のルクセリタスがおすすめです。