WordPressサイトの高速化は、ユーザー体験の向上やSEO対策（検索エンジン最適化）において非常に重要です。

WordPressサイトの表示速度を改善するための主な方法を、優先度の高いものから順にご紹介します。

🚀 主要な高速化施策

1. 画像の最適化

画像はWebサイトのデータ量の大部分を占めることが多く、最も効果的な改善ポイントの一つです。

  • ファイルサイズを軽量化する:
    • 圧縮: 画質を大きく落とさずにファイルサイズを小さくします。オンラインツールやプラグイン（例: EWWW Image Optimizer、TinyPNG）を利用できます。
    • 適切なサイズにリサイズ: 実際に表示されるサイズ以上の大きな画像をアップロードしないようにします。
  • 次世代画像フォーマット（WebP）の利用:
    • 従来のJPEGやPNGよりも高い圧縮率を持つWebP形式に画像を変換して配信します。
  • 遅延読み込み（Lazy Load）:
    • 画面に表示されていない（スクロールしないと見えない）画像や動画の読み込みを遅らせ、最初に表示されるコンテンツの読み込みを優先します。多くの高速化プラグインにこの機能が含まれています。

2. キャッシュの活用

Webサイトがリクエストされるたびにデータベースへの問い合わせやPHPの処理を行うと時間がかかります。キャッシュを利用することで、生成されたHTMLファイルを一時的に保存し、2回目以降のアクセスに対しては高速に表示できます。

  • キャッシュプラグインの導入:
    • LiteSpeed Cache、WP Super Cache、W3 Total Cache などのプラグインを導入し、設定を最適化します。これにより、ページ、ブラウザ、データベースなど様々なキャッシュを有効にできます。

3. サーバー環境の見直し

  • 高性能なサーバーへの移行:
    • WordPressサイトの処理能力はサーバーのスペックに大きく依存します。共有サーバーから処理能力の高いレンタルサーバーや**VPS（仮想専用サーバー）**へ移行することで、応答速度が改善されます。
  • PHPのバージョンアップ:
    • 古いPHPバージョンは処理速度が遅く、セキュリティ上のリスクもあります。サーバー側で最新または推奨されているPHPバージョン（例: PHP 8.x系）に更新します。

🛠️ その他の改善ポイント

4. テーマとプラグインの最適化

  • 軽量なテーマの選択:
    • 多機能なテーマやページビルダーよりも、シンプルで軽量なテーマ（例: 公式テーマや高速化に特化したテーマ）を選ぶと表示速度が向上します。
  • 不要なプラグインの削除:
    • 使用していない、または機能が重複しているプラグインはすべて無効化し、削除します。プラグインはWordPressに負荷をかける主な原因の一つです。

5. CSS・JavaScriptの最適化

  • 圧縮（Minify）:
    • HTML、CSS、JavaScriptファイルから、不要な空白やコメントを削除し、ファイルサイズを削減します。
  • 結合（Combine）:
    • 複数のCSSファイルやJavaScriptファイルを一つに統合することで、ブラウザがサーバーにリクエストする回数（HTTPリクエスト数）を減らします。
  • 遅延読み込み（Defer/Async）:
    • ページの表示に不可欠でないJavaScriptファイルについて、読み込みを遅延させ、重要なコンテンツの表示を優先します。これも高速化プラグインで設定できることが多いです。

6. データベースのクリーンアップ

  • リビジョンの削除:
    • 投稿や固定ページを編集するたびに保存される**リビジョン（過去の変更履歴）**や、下書き、ゴミ箱の内容を定期的に削除し、データベースの負荷を軽減します。プラグインで自動化することも可能です。

これらの施策を組み合わせて実施することで、WordPressサイトの高速化が期待できます。まずは画像の最適化とキャッシュプラグインの導入から試してみることをお勧めします。

サイトの表示速度は、GoogleのPageSpeed Insightsなどのツールで計測できますので、改善前後の効果を確認してみてください。

Webサイトの高速化の目安は、ページが3秒以内に表示されることです。また、PageSpeed Insightsのスコアが50点以上（特にモバイルは55～65点以上）を目指し、Core Web VitalsのLCP（Largest Contentful Paint）が2.5秒以下であることが望ましいとされます。 

WordPressを高速化する方法11選
さくらのレンタルサーバでWordPressサイトを高速に動かす方法
Webサイトが重い原因とは？効果的な表示速度改善方法
WordPress 高速化 - Google 検索

方針

  • 不具合が発生しにくくなるよう、なるべくシンプルな構成にする。
  • 手持ちの環境 (1Gbps 回線、PC、Chrome) で、ブラウザキャッシュをクリアした状態で、画像多めのページが 3秒以内に表示されれば OK とする。

結論

  • EWWW Image Optimizer を導入し webp 変換を有効化。
  • WP Super Cache を導入し、以下の設定を行った。
    • 推奨設定を有効化。
    • 除外する URL 文字列に contact を追加（お問い合わせページをキャッシュしない）。
    • 「コメントが投稿されたときに該当のページだけリフレッシュする。」を有効化。
  • Lightning (VK All in One Expansion Unit) の以下の設定を有効化。
    • CSS 最適化
      • Tree shaking を有効化
      • Preload CSS を有効化
    • Contact Form 7 アセットファイル最適化
    • 絵文字の無効化
  • .htaccess にGZIP圧縮とブラウザキャッシュの記述を追加。
.htaccess
# GZIP圧縮
<IfModule mod_deflate.c>
SetOutputFilter DEFLATE

# 圧縮しないファイル
SetEnvIfNoCase Request_URI ¥.(?:gif|jpe?g|png|webp|ico)$ no-gzip dont-vary

# 圧縮するファイル
AddOutputFilterByType deflate text/plain
AddOutputFilterByType deflate text/html
AddOutputFilterByType deflate text/xml
AddOutputFilterByType deflate text/css
AddOutputFilterByType deflate application/xml
AddOutputFilterByType deflate application/xhtml+xml
AddOutputFilterByType deflate application/rss+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>

# ブラウザキャッシュ
<FilesMatch "\.(css|js|jpg|jpeg|gif|png|svg|svgz|webp|ico|bmp|woff|woff2|ttf|otf)$">
Header set Cache-Control "max-age=604800"
</FilesMatch>

試したこと、考察

  • 初期状態で既に目標はクリアしていた。初回訪問時の平均 LCP は 0.94 秒。
  • 画像の最適化
    • 画像は転送量の大部分を占めるため、特に回線が遅い場合に効果が大きい。最適化しておきたい。
    • できれば高圧縮の avif にしたかったが、有料プラグインでしか対応していないようだ。
    • 自力でツールを作って対応することもできるが、そこまで手間をかけても見返りは少なさそうだった。
    • ひとまず定番の無料のプラグインで自動 webp 化することにした。
  • HTML/CSS/JS最適化
    • Autoptimize を試したが、あまり変化がなかった。
    • ひとまずテーマに標準で備わっている最適化機能を有効にした。
  • PHP JIT
    • 不具合（ページ編集時に固まる）が起きるため使えなかった。
  • データキャッシュ
    • APCu Manager を試した。動的ページ生成にあまり変化が見られなかった。（0.6秒 → 0.55秒）
  • ページキャッシュ
    • WP Super Cache を試した。動的ページ生成が3倍位高速になった。（0.6秒 → 0.2秒）
  • CDN
    • デスクトップPCのスコアはあまり変化がなかった。
    • モバイルのスコアはかなり上がるようだ。モバイルを対象するときは検討の価値がありそうだ。
    • コメント欄を設置しているページのキャッシュ除外設定が必要なのが少し面倒だった。
  • ブラウザキャッシュ
    • 2回目以降の読み込みが約2倍高速になった。
  • GZIP圧縮
    • WP Super Cache の設定で圧縮を有効にした。動的テキストファイル(HTML)の転送容量が5分の1になった。
    • .htaccess に GZIP 圧縮の記述を追加した。静的テキストファイル(CSS/JS)の転送容量が7分の1になった。