WordPress Breezeキャッシュプラグインの設定方法

Breezeはクラウドウェイズによって提供されています WordPress用のキャッシュプラグインです。クラウドウェイズではなくウェブホスティングで動作しています WordPressでもインストールは可能ですが、モバイルキャッシュなど一部の機能はクラウドウェイズでのみ動作します。

キャッシュプラグインをインストールすると、サイトの速度が大幅に向上する可能性があります。ただし、キャッシュ設定が間違っていると、サイトのレイアウトが壊れるなどの問題が発生する可能性があります。詳細設定を変更しながら、自分のサイトに合った設定を見つける作業が必要な場合があります。

この記事では、Breezeキャッシュプラグインを設定する方法について説明します。私のブログで使用される設定中心として説明します。

💡 クラウドウェイズ加入方法(+ 60%割引クーポン)

WordPress Breezeキャッシュプラグインの設定方法

クラウドウェイで WordPress アプリケーションをインストールすると、Breezeプラグインが自動的にインストールされます。サイト速度を効果的に向上させるには、キャッシュプラグインを慎重に設定することが重要です。

ブリーズプラグインが有効な場合 設定 » Breezeに移動して設定を開始できます。

Basic Options(基本オプション)タブ

WordPress Breeze キャッシュプラグイン Basic options

1 Cache System:有効を選択すると、キャッシュ機能が有効になります。

2 モバイルキャッシュ:モバイルキャッシュ機能です。この機能を利用するには ガイド リンクのドキュメントを参照して、以下のようにアプリケーション設定で デバイスの検出 機能を有効にする必要があります。

クラウドウェイズアカウントにログインして、アプリケーションリストからそのアプリケーション(WordPress サイト)を選択し、 アプリケーションの設定 メニューを選択します。

クラウドウェイズアプリケーションの設定

Device Detection (デバイス検出) 機能を有効にします。

クラウドウェイズデバイス検出機能を有効にする

Cloudways デバイスの検出 機能は、ウェブサイトの訪問者が使用するデバイス(デスクトップ、タブレット、モバイルなど)をサーバー側で自動的に認識できるようにする機能です。この機能を使用すると、各デバイスに合わせて最適化されたWebページのコンテンツやレイアウトを動的に提供することができ、ユーザーエクスペリエンスが向上します。 Device Detectionは、主にブラウザのUser-Agent情報を分析して動作し、複雑なルール処理や機器情報の隠蔽(User-Agentマスキング)まで検出できるように設計されています。

この機能は、特に適応型Webデザインの適用に役立ちます。たとえば、モバイルユーザーの場合は、画像やスクリプトをより軽くしたり、デスクトップユーザーにはより豊富なインターフェースを提供することで、接続機器の特性に合った環境を実装できます。サーバー側で処理される方式なので、CSSメディアクエリだけで不足した高級機器分岐にも活用されます

👉 この機能は最近追加されたクラウドウェイズの新機能であるようですね。この機能を有効にしたときと無効にしたときの速度の違いを監視し、有効にしたときにモバイルデバイスで問題が発生していないかどうかをチェックして、使用するかどうかを決定することをお勧めします。

3 Purge Cache After: キャッシュが自動的に削除される時間を設定します。デフォルトは1440(1日)です。掲示板にユーザーが頻繁に投稿するコミュニティであれば、この時間を短く設定できます。コンテンツを頻繁に発行せずにTermが長い場合は、この時間を長く設定することを検討できます。

これとは別に、文を発行するときに手動でキャッシュを消去することも可能です。

4 Gzip圧縮: 有効にします。

Gzip圧縮は、WebサーバーがHTML、CSS、JavaScriptなどのテキストファイルをユーザーに送信する前に圧縮して送信する技術です。これにより、ファイルのサイズが小さくなり、ネットワークが高速化され、トラフィックを節約できます。

5 ブラウザキャッシュ: ブラウザキャッシュ機能を有効にします。

ブラウザキャッシュは、ユーザーが訪問したWebサイトの画像、HTML、CSS、JavaScriptなどのリソースを一時的に保存するためのスペースです。このように保存されたファイルは、次のようなWebサイトにアクセスしたときにサーバーから再度ダウンロードされることなく、キャッシュから素早く呼び出され、ページの読み込み速度が大幅に向上し、ネットワーク使用率も低下します。キャッシュを保存するかどうかは、サーバーが送信するキャッシュ制御ヘッダーによって決定され、最新のコンテンツを効率的に管理できます。

いくつかのキャッシュプラグインと WordPress 環境でブラウザキャッシュ機能を有効にすると、新しい記事を発行してもフロントページに正しく表示されない問題が発生する可能性があります。このサイトでは、過去にブラウザキャッシュの問題としてSEOで深刻な損害を見たことがあります。 Breezeでは、ブラウザキャッシュを有効にしても、そのような問題はうまく表示されないようです。新しい記事を発行してキャッシュを削除しても、30時間以内に新しく発行した記事がホームページに表示されない場合は、ブラウザのキャッシュ機能を無効にしてテストしてください。

WordPress Breezeキャッシュプラグインの設定

画像の遅延読み込みCross-origin Safe Links 機能は有効にできますが、サイトに異常が発生していないかチェックしてください。私はこれら2つのオプションを無効にしています。

WordPress 独自のイメージ遅延ロード機能を提供しています。 画像の遅延読み込み オプションを有効にすると、サイト画像が正しく表示されないか、異常が発生する可能性があります。

Cross-origin Safe Links 기능도 WordPress サイトに異常現象を引き起こす可能性があります。私は、ブロックエディタのコードブロックが正しく動作しないという現象が発生したため、このオプションをオフにしました。

Cache Logged-in Usersは通常無効にする必要があります。

File Optimization(ファイル最適化)タブ

Breezeプラグインファイル最適化の設定

ファイルの最適化は、サイトの速度に最大の影響を与えるオプションを提供します。ここでは設定に注意してください。設定中にサイトのレイアウトや機能に影響を最小限に抑えながら、最も高速なオプションを見つけてください。

HTML の縮小は有効または無効にできます。有効にすると、HTMLコードサイズが減少し、サイトの速度にわずかに利益があります。私は無効にしました。

CSS設定では、各オプションを有効/無効にしてサイトのレイアウトに影響しないことを確認してください。私は次のように設定しました。

  • CSS Minify: 有効
    • Font remain visible during load: 無効
  • Include Inline CSS: 無効。このオプションを有効にしたときにサイトに異常がない場合は有効にできます。
  • Combine CSS: 活性化。有効にしたときにサイトにエラーが発生した場合は無効にしてください。
  • Exclude CSS: Minification(コード軽量化、コード最小化)から除外するCSSファイルのパスを入力します。私は空白のままにしました。キャッシュしてはいけないCSSファイルがある場合は、ここにパスを入力してください。
BreezeプラグインJavaScript設定

JavaScript関連の設定です。同様に、慎重に設定しながらサイトに影響を与えずにサイトの速度を最大化するオプションを見つけてください。

JS Settingsでは、次のように設定しました。😄

  • JS Minify:有効。
  • Include Inline JS: 有効
  • Combine JS: 有効
  • Exclude JS: Minification から除外する JS ファイルのパスを指定します。

テスト方法:

各オプションを有効にしてキャッシュを削除した後は、ログインしていない状態でサイトにアクセスして問題が発生していないことを確認してください。 Google Chromeのシークレットモードでテストすることも可能です。

キャッシュの削除は、管理者ページの上部のツールバーから Breeze » Purge All Cacheをクリックしてキャッシュを削除できます。

Breezeキャッシュの削除

Preload(プリロード)タブ

Breezeプラグインプリロード設定

Preloadページでは、Webフォント、リンクなどのプリロード関連設定を行うことができます。

👉 上の図のように "One (or more) URL is invalid. Please check and correct the entry" エラーが表示された場合は、URLの前に「//」を削除して入力してください。例:

s.gravatar.com
0.gravatar.com
1.gravatar.com
2.gravatar.com
pagead2.googlesyndication.com
googleads.g.doubleclick.net
google-analytics.com
googletagmanager.com
www.google-analytics.com
www.googletagmanager.com
fonts.googleapis.com
fonts.gstatic.com

1 Preload Webfont: Webフォントはサイトの速度に影響を与える可能性があります。ローカルフォントURLまたはフォントのみをロードするCSSファイルのURLをここで指定できます。 CSSファイル全体をプリロードするとサイト全体の速度が遅くなるため、フォントのみをロードするCSSファイルを指定する必要があります。私は別のWebフォントをロードしていないので空白のままにしました。

2 Preload Links: ユーザーがリンクの上にマウスを置くと、あらかじめキャッシュが生成されます。これにより、リンクにアクセスするとすぐにページが読み込まれます。この機能は、Chrome、Opera、Microsoft Edge、Chromeum、BraveなどのChromeベースのブラウザでのみサポートされています。

Naver ウェールもクロミウムベースのブラウザなのでこの機能をサポートしそうですが、確認が必要です。参考までに Naver ウェールブラウザで WordPress 管理者ページまたはWebホスティング管理ページにアクセスすると、予期しないエラーが発生する可能性があるため、可能な限り使用しないでください。

3 Prefetch of DNS Request:Webページが外部リソースを呼び出すときに、そのリソースのドメインに対するDNSルックアップを事前に実行してIPアドレスをキャッシュする機能です。これにより、ユーザーが実際に外部ドメインにアクセスするときにDNSルックアップにかかる時間が短縮され、ページの読み込み速度が速くなります。

以下のように設定できます。

s.gravatar.com
0.gravatar.com
1.gravatar.com
2.gravatar.com
google-analytics.com
www.google-analytics.com
ssl.google-analytics.com
pagead2.googlesyndication.com
tpc.googlesyndication.com
googleads.g.doubleclick.net
adservice.google.com
youtube.com
www.youtube.com
i.ytimg.com
yt3.ggpht.com
ajax.googleapis.com
apis.google.com
fonts.googleapis.com
fonts.gstatic.com

参考にグーグルしてみると、ほとんど以下のように // を追加された URL を提示しますが、この場合 "One (or more) URL is invalid. Please check and correct the entry" 警告が表示されます。

//s.gravatar.com
//0.gravatar.com
...

Breezeプラグインに自動的に//を追加するようです。したがって、区切り文字(//)なしでドメインアドレスのみを入力すると機能するようです。実際にHTMLソースを見ると、「dns-prefetch」タグが正常に挿入されていることを確認できます。 (参考に設定で//を追加してもプラグインで調べて正常に処理するようです。)

Advanced Options(詳細オプション)タブ

Breezeプラグインの詳細オプションタブ

詳細オプションでは、キャッシュから除外するURLを指定できます。

Never Cache URL(s)から次のファイルがキャッシュされないように除外することをお勧めします。

  • サイトマップURL
  • RSSフィードURL
  • robots.txtの
  • ads.txt(AdSense 広告を表示する場合)

サイトマップなどのファイルに対してキャッシュ除外設定を行わないと、問題が発生することがあります。

Googleの流入が突然減少した場合、サイトマップ、フィード、robots.txtなどのファイルに対してキャッシュ除外して流入が再び回復したという事例もあります(参照).

ケミクラウドを使用している場合でもLiteSpeed Cacheプラグインを使用している場合は、同様のアクションを実行する必要があります。

絵文字を無効にするを有効にすると、絵文字ライブラリとCSSロードを無効にできます。これにより、わずかな速度利得を得ることができる。絵文字を使用していない場合は、無効にすることを検討してください。

Host Files Locallyでは、Googleフォント、Google Analytics、 Facebook ピクセル、グラバタなどをローカルでホストして速度向上を図ることができます。

最後に、

以上で、Breezeキャッシュプラグインの設定方法について見てきました。キャッシュプラグインは両刃のコムと言えます。うまく活用すると速度の向上に大きな助けになりますが、間違って設定するとサイトレイアウトが壊れたり、新規文を発行しても表示ができないなどの問題が発生することがあります。

ブラウザのキャッシュ時間を1440に設定すると、1440秒(1日)間隔でキャッシュが削除され、キャッシュが削除される前に変更が反映されないことがあります。強制的に反映するには、キャッシュを削除する必要があります。

したがって、ブラウザのキャッシュ機能のため、投稿を発行してから一定時間以内に(キャッシュを削除しない限り)変更は反映されない可能性があり、これは通常の動作です。

本文の内容を参考に、自分のサイトに適したキャッシュ設定(特に ファイルの最適化 タブ設定)を探してください。

参考までに クラウドウェイズは、訪問者が多いか規模の大きいサイトを運営する場合、または複数のサイトを管理したい場合は、まともな選択肢かもしれません。ブログを始める段階であれば、 Bluehostに似たレベルのコスパ比 ケミクラウド(ChemiCloud)のようなホスティングを検討することができます。ケミクラウドはソウルサーバーを導入し、韓国でもスピードが速いです😄

参照

8のコメント

コメントを残す

  1. Breezeキャッシュプラグイン設定のため悩みましたが、よくまとめられていていいですね!モバイルキャッシュ機能もぜひ有効にする必要があるようですが、クウェではDevice Detection機能を有効にすればいいのです。

    キャッシュ設定後にサイトの速度がどれだけ速くなったかを体験した経験がありますか?

    返信
    • モバイルキャッシュはおっしゃるとおり、Device Detectionだけ有効にしてもうまく動作して設定が簡単な方です。クラウドウェイズでのみ設定が可能です。

      キャッシュプラグインをインストールしてうまく設定すると、ログアウト状態(一般訪問者)で速度が大幅に向上する可能性があります。どの程度改善されるかは、個々のサイトによって異なる場合があります。

      特に GeneratePress などのような軽いテーマを使用すると、キャッシュプラグインを有効にしなくても速度がまともに出ることができます。

      返信
  2. Breezeキャッシュプラグインの設定の詳細な説明が本当に役に立ちます。特にモバイルキャッシュ機能が重要であるという点で、Device Detection設定を有効にする方法が便利です。

    Breeze設定でサイトの速度を最適化するときに注意する必要がある他の点がありますか? LiteSpeed Cacheプラグインと比較してどうでしょうか?

    返信
  3. キャッシュ設定が間違っているとレイアウトが壊れることがあること、私も経験したことがあり共感します。

    モバイルキャッシュ機能を有効にする方法もよく説明してくれておかげで簡単にできると思います。もしクラウドウェイズ以外のホスティングでも同様の効果を見ることができるキャッシュプラグインがあるのでしょうか?

    返信
    • キャッシュプラグインでモバイルキャッシュをサポートすることはまれです。 WP Rocket(有料)で、おそらくモバイルキャッシュ機能が提供されていないと思われます。
      人気のあるキャッシュプラグインとして、最近ではLiteSpeed Cacheが人気を集めています。

      返信
  4. 説明してくれたBreeze設定のヒントが本当に便利ですね。 Webホスティングでも試してみることができるなんてスピードアップへの期待が大きい。

    返信