WP Performance:キャッシュ化と表示速度の高速化ができる

2019年4月7日

オールインワンパッケージでサイトのキャッシュ化と最適化を行える WordPress 用プラグインの紹介です。
それは「WP Performance」です。
そのインストール手順から日本語化・使い方と設定などを解説していきます。

WP Performance

Screenshot of wordpress.org

WP Performance は、オールインワンパッケージでサイトのキャッシュ化と最適化をおこなって、ページの表示速度の高速化ができます。

  • ページキャッシュ(モバイル端末用の個別キャッシュも生成可)
  • キャッシュプリロード
  • ブラウザキャッシュ
  • GZIP 圧縮
  • HTML/ JavaScript/ CSS コードのサイズを縮小
  • JavaScript ファイルと CSS ファイルの無効化
  • JavaScript ファイルと CSS ファイルの非同期ロード
  • JavaScript ファイルと CSS ファイルのインライン化
  • JavaScript ファイルの結合
  • CSS ファイルの結合
  • クリティカルレンダリングパスの CSS に関する箇所の改善
  • 画像の読み込み遅延
  • srcset 属性を用いた画像のレスポンシブ対応と高解像度対応
  • サムネイル画像のカスタムサイズの追加
  • サムネイル画像の再生成
  • ゴミ箱・リビジョン・自動下書き・スパムコメント・期限切れトランジットの手動・自動削除
  • CDN サーバとの連携
  • Resource Hints(DNS-Prefetch/ Preconnect)によるリソースの事前取得のサポート

Resource Hints の詳細について(https://w3c.github.io/resource-hints/)

アドオンを導入すると以下の機能も使えるようになります。

  • Cloudflare アカウントとの統合
  • Dynamic page preload の有効化
  • Varnish Cache の有効化

WP-CLI もサポートしており、サポートしているコマンドは以下のとおり。

  • wp wpp flush – ページキャッシュのクリア
  • wp wpp disable – WWP Performance を一時的に無効化
  • wp wpp enable – WP Performance の有効化
  • wp wpp cleanup – 全てのデータベースのクリーンアップの実行
  • wp wpp cleanup trash – ごみ箱の削除の実行
  • wp wpp cleanup spam – スパムコメントの削除を実行
  • wp wpp cleanup revisions – リビジョンの削除を実行
  • wp wpp cleanup transient – 期限切れトランジェントの削除を実行
  • wp wpp cleanup drafts – 下書きの削除を実行
  • wp wpp cleanup cron – 未使用の cron タスクの削除を実行

このプラグインの各種設定のインポート・エクスポート

Javascript ファイルと CSS ファイルの結合もできますが、
HTTP/2 の環境下で結合を行うとかえって表示速度の改善にならないケースもあります。
なので、他の設定を行ってから個別で設定を行うと良いかもです。
HTTP/2ではJSやCSSの結合は表示速度改善への妨げになるかも – WordPress 活用術

記事を作成もしくは更新時点でのバージョン:v 1.1.3.2
マルチサイトでの利用:可

Gutenberg エディターでの動作

Gutenberg エディターに追加される機能は無いので、気にする必要は無いです。

インストール手順

下記の URL から ZIP ファイルを入手して、管理画面からアップロードして有効化するか
WP Performance – WordPress.org

もしくは、WordPress.org の公式プラグインディレクトリにリリースされているので、
管理画面から入手できます。

ダッシュボードから「プラグイン」メニューの「新規追加」を選択し、
プラグイン追加画面右上の検索窓に「WP Performance」と入力します。

WordPressプラグイン「WP Performance」のスクリーンショット

検索結果の一番左上に表示されると思うので、「今すぐインストール」をクリックします。
※一番左上に表示されない場合は、上記の画像から探して下さい。
インストールが完了したら、プラグインを「有効化」します。

プラグインのインストールに慣れていない方は、
下記の記事にて詳しく解説していますので、御覧ください。

WordPressプラグインのインストール手順を解説 – WordPress活用術

日本語化

WP Performance を有効化した際に日本語化されない場合には、
日本語化用の言語パックを translate.wordpress.org から入手できる場合があります。

WordPress と関連プロジェクト(テーマ・プラグイン)用の翻訳プラットフォームとして、
translate.wordpress.org (GlotPress) が導入されています。

※ボランティアで翻訳されている場合が多いので、
全てのプラグインで、必ずしも日本語化用の言語パックが用意されているわけでは無いです。
また、用意されていても 100% 翻訳されている保証もありません。

日本語化用の翻訳ファイルの探し方は、下記の記事を参照してください。

WordPress公式での日本語化用の翻訳ファイルの探し方 – WordPress活用術

専用メニュー

WordPressプラグイン「WP Performance」のスクリーンショット

ダッシュボードの「設定」メニューの下に追加されています。

使い方

CACHE

WordPressプラグイン「WP Performance」のスクリーンショット

  • Enable cache
    キャッシュを有効にするかどうか。

WordPressプラグイン「WP Performance」のスクリーンショット

Separate cache for mobile devices
モバイル端末用の個別キャッシュを作成するかどうか。

Clear cache after
キャッシュの有効期限を分間・時間・日間で指定します。

Clear cache when
キャッシュをクリアするタイミングを選択します。

  • A new post or page is published or updated
    投稿もしくは固定ページを公開時または更新時。
  • A post or page is deleted
    投稿もしくは固定ページを削除した時。
  • WP Performance settings are saved
    WP Performance の設定を保存した時。

Cache preloading
キャッシュの事前ロードに使用する XML サイトマップへのパスを入力します。

Browser caching

WordPressプラグイン「WP Performance」のスクリーンショット

  • Leverage browser caching
    ブラウザキャッシュを有効にするかどうか。
  • Enable gzip compression
    GZip 圧縮を有効にするかどうか。

Cache staticstics

WordPressプラグイン「WP Performance」のスクリーンショット

キャッシュされている HTML/ CSS/ Javascipt のサイズを確認できます。
また。「Clear cache」でキャッシュのクリアができます。

Exclude URL(s) from cahce

WordPressプラグイン「WP Performance」のスクリーンショット

キャッシュ化しないページを URL で指定できます。

Exclude User Agent(s) from cahce

WordPressプラグイン「WP Performance」のスクリーンショット

キャッシュしたページを渡さないユーザーをユーザーエージェントで指定できます。

「Exclude search engines」にチェックを付けると検索エンジンも対象外となります。

CSS

WordPressプラグイン「WP Performance」のスクリーンショット

WordPressプラグイン「WP Performance」のスクリーンショット

テーマ及びプラグインで使用されている CSS ファイルの圧縮・インライン化・結合・無効化ができます。

WordPressプラグイン「WP Performance」のスクリーンショット

  • Minify inline CSS
    インライン CSS コードのサイズを縮小するかどうか。
  • Asynchronously load CSS
    CSS ファイルを非同期ロードするかどうか。
  • Critical CSS path
    クリティカルCSSパスを入力します。(非同期ロードで不具合が起きた時に改善される場合があります)

critical CSS pathを入力後「Generate critical CSS path」ボタンをクリックします。

WordPressプラグイン「WP Performance」のスクリーンショット

  • Combine Google Fonts
    1 リクエストで全ての Google Fonts を読み込めるように結合するかどうか。
  • Disable CSS optimization for logged-in users
    ログインユーザーに対して CSS の最適化を無効にするかどうか。

WordPressプラグイン「WP Performance」のスクリーンショット

使用したい Resource Hints のオプションを選択します。

WordPressプラグイン「WP Performance」のスクリーンショット

Exclude URL(s) from CSS optimization
CSS の最適化を除外する URL を 指定できます。

JAVASCRIPT

WordPressプラグイン「WP Performance」のスクリーンショット

WordPressプラグイン「WP Performance」のスクリーンショット

テーマ及びプラグインで使用されている Javascript ファイルの圧縮・インライン化・結合・無効化ができます。

WordPressプラグイン「WP Performance」のスクリーンショット

  • Minify inline JavaScript
    インライン JavaScript コードのサイズを縮小するかどうか。
  • Asynchronously load JavaScript
    JavaScript ファイルを非同期ロードするかどうか。
  • Disable JavaScript optimization for logged-in users
    ログインユーザーに対して JavaScript の最適化を無効にするかどうか。

WordPressプラグイン「WP Performance」のスクリーンショット

使用したい Resource Hints のオプションを選択します。

WordPressプラグイン「WP Performance」のスクリーンショット

Exclude URL(s) from JavaScript optimization
JavaScript の最適化を除外する URL を 指定できます。

IMAGES

WordPressプラグイン「WP Performance」のスクリーンショット

  • Lazy load
    画像の読み込み遅延を行うようにするかどうか。
  • Responsive images
    レスポンシブイメージを生成するかどうか。

WordPressプラグイン「WP Performance」のスクリーンショット

サムネイルサイズの復元とサムネイルサイズの削除ができます。

WordPressプラグイン「WP Performance」のスクリーンショット

カスタムサイズの追加とサムネイル画像の再生成ができます。

DATABASE

WordPressプラグイン「WP Performance」のスクリーンショット

  • Trash
    ゴミ箱に入っている全ての投稿・固定ページ・コメントを削除できます。
  • Revisions
    全てのリビジョンを削除できます。
  • Auto Drafts
    全ての下書きを削除できます。
  • Spam
    全てのスパムコメントを削除できます。
  • Transients
    期限切れの全てのトランジットを削除できます。
  • Scheduled tasks
    全ての未使用のスケジュールされている Cron タスクを削除できます。

「Delete all(999)」ボタンをクリックすると全ての項目が削除されます。

WordPressプラグイン「WP Performance」のスクリーンショット

自動でデータベースをクリーンアップしたい時に選択します。
実行タイミングを毎日・毎週・毎月を選択できます。

CDN

WordPressプラグイン「WP Performance」のスクリーンショット

  • Enable CDN
    CDN を有効にするかどうか。
  • CDN hostname
    CDN サーバーのホスト名を入力します。

WordPressプラグイン「WP Performance」のスクリーンショット

Exclude file(s) from CDN
CDN サーバーから除外するファイルを指定できます。

SETTINGS

WordPressプラグイン「WP Performance」のスクリーンショット

  • Import settings
    設定をインポートできます。
  • Export settings
    設定をエクスポートできます。
  • Troubleshooting logging
    トラブルシューティング用にログを保存するかどうか。

WordPressプラグイン「WP Performance」のスクリーンショット

保存されている構成一覧。

ADD-ONS

WordPressプラグイン「WP Performance」のスクリーンショット

使用できるアドオン一覧です。

補足情報

動的コンテンツを表示させていると静的 HTML を作成すると不都合が起きるケースがあります。
No Cache AJAX Widgets は、キャッシュ化したくない様々な動的コンテンツをキャッシュ化せずに表示できるウィジェットを設置できます。

No Cache AJAX Widgets の使い方 – WordPress 活用術

代替プラグイン

WP Performance にほしい機能が無かった場合には、
WP Performance 以外にもサイトのページ表示速度の高速化ができるプラグインを記事にしています。
以下では、WP Performance を含めて 7 個を簡単に紹介しています。

サイトのページ表示速度の高速化ができるWordPressプラグイン一覧

WP Performance にほしい機能が無かった場合には、
WP Performance 以外にも静的 HTML を生成しキャッシュ化できるプラグインを記事にしています。
以下では、WP Performance を含めて 14 個を簡単に紹介しています。

静的HTMLを生成しキャッシュ化できるWordPressプラグイン一覧

URL

WP Performance – WordPress.org

本ページはアフィリエイトプログラムによる収益を得ています