Cloudwaysは Breeze に大きな変更を加えたので、今日のチュートリアルはCloudways Breezeのセットアップ方法についてです。 このプラグインは改善されており、JavaScript 遅延、ハートビート コントロール、プリロード フォント、およびプリフェッチが追加されています。 星 3.8/5 の評価しかありませんが、新しい機能を追加してアプリをより安定させてくれることを願っています。
ほとんどの Breeze 設定は、WP Rocket や FlyingPress などの他のキャッシュ プラグインに見られるものと似ているため、Breeze の設定と TTFB と読み込み時間のテストには数分しかかかりません. Cloudwaysには Breeze チュートリアルもありますが、プラグインに既に含まれているものにはあまり追加されません. プラグインをインストールし、チュートリアルに従って理解を深めてください。
基本オプション
もちろん、キャッシュプラグインでキャッシュをサポートする必要があるため、キャッシュシステムをオンにします。
Purge Cache After を 1440 に設定します。これはキャッシュの有効期間で、1 日に設定されています。 CPU の使用率が高い場合や、コンテンツを頻繁に投稿しない場合は、この数値を変更できます。
素晴らしいウェブサイトを作成します
最高の無料ページビルダーElementor を使用
今すぐ始めるGzip 圧縮をオンにして、コンテンツを圧縮して HTML、CSS、および JS のサイズを縮小します。
期限切れのヘッダーを追加してブラウザが特定のファイルを保存できるように、ブラウザ キャッシュをオンのままにします。
Lazy Load Images オプションをそのまま使用します。 iframe を遅延ロードし、ブラウザ自体の遅延ロード機能を使用する設定。 個人的には、画像の最適化には (Breeze ではなく) Cloudflare Enterprise を使用します。これには Mirage + Polish が付属しています。 Breeze には、画像が遅延読み込みされないようにしてバックグラウンドで画像を遅延読み込みしたり、YouTube の iframe をプレビュー画像に置き換えたりするオプションがありません。 また、画像をプリロードしたり、不足している画像のサイズを追加したり、WebP を使用したり、モバイル用に画像のサイズを変更したりする方法もありません。 代わりに、コンテンツ配信ネットワーク (CDN) または画像最適化プラグインを使用してください。
外部リンクに「noopener noreferrer」を追加できるように、Cross-origin Safe Links をオンのままにします。 これにより、リンクが配置されている Web サイトへのアクセスをブロックしたり (noopener)、参照情報を非表示にしたり (noreferrer) することで、セキュリティが向上します。 これらが SEO やアフィリエイト リンクに悪影響を与えることはありません。
ログインユーザーのキャッシュをオフにします。 ほとんどのサイトでは、メンバーシップ サイトなどを運営している場合を除き、ログイン ユーザーをキャッシュする必要はありません。その場合はロールを選択します。
ファイルの最適化
これらの設定をテストして、サイトが壊れたり、ウェブ上でより重要になったりするかどうかを確認する必要があります。 縮小設定によってサイトが破損する場合は、ソース コード内の壊れたファイルを見つけて、それらが縮小されないようにして、残りのファイルを縮小できるようにすることをお勧めします。
HTML 設定
空白とコメントを出力して HTML ファイルのサイズを縮小できるように、HTML 縮小オプションをオンのままにします。
CSS 設定
プラグインが CSS ファイルから空白とコメントを削除してファイルを小さくできるように、CSS 縮小オプションをオンにする必要があります。
ロード中もフォントが表示されたままになるはずです。 フォントの CSS に font-display: swap を追加することで、Web フォントの読み込み中にテキストが表示されたままになるように、PSI の推奨事項を修正できます。 これにより、通常のフォントの読み込み中にフォールバック フォントを読み込むようにコンピューターに指示します。 これにより、FOIT (目に見えないテキストのフラッシュ) は停止しますが、FOUC (判読できないテキストのフラッシュ) (スタイル設定されていないコンテンツのフラッシュ) が発生します。 どちらかお選びいただけますので、両方お試しください。
[インライン CSS を含める] オプションをオンにすると、インライン CSS (外部 CSS ではなく、HTML ファイルにある CSS) も縮小されます。 サイトが壊れることがあるため、この設定をテストするときは注意してください。
WP Johnny によると、小さな CSS/JS ファイルを含むサイトのみがそれらを結合するべきであり、大きなサイトはそうすべきではないため、CSS の結合をオフにします。 GTmetrix ウォーターフォール チャートで CSS と JS のサイズを確認します。
CSS を除外するオプションを使用します。 問題の原因となるファイルがいくつかある可能性があります。 ソース コードでこれらのファイルを見つけてリストに追加し、縮小または結合されないようにします。
JS 設定
JS Minify をオンにすると、空白とコメントが削除され、JS ファイルのサイズが縮小されます。
結合 JS に終止符を打ちます。 CSS と JavaScript を組み合わせるのと同じ考え方です。 繰り返しになりますが、GTmetrix ウォーターフォール チャートを確認し、JavaScript ファイルのサイズが非常に小さい場合にのみ結合してください。
[インライン JS を含める] をオフにしないでください。 CSS をインラインで含めるのと同じ考え方ですが、JS ファイルの場合です。
Exclude JS は、Exclude CSS と同じ方法で使用されます。 JS 設定が問題の原因となっている場合は、原因となっているファイルを見つけて削除します。
Move JS Files to Footer では、多くのテーマとプラグインがすでに JavaScript ファイルをフッターにロードしています。 ただし、フッターに読み込まれていないがヘッダーに読み込まれている JS ファイルがある場合は、ここに追加できます (縮小されたファイルはサポートされていません)。 サイトを簡単に破壊する可能性があるため、注意してください。
これを選択してください。 読み込みが遅延された JS ファイルは、JavaScript を遅延させることで、レンダリングをブロックするリソースの PSI 項目を修正できる場合のみ。 これは、どの JavaScript ファイルを延期する必要があるかを学習するのに適した場所です。 ただし、ページの読み込みに必要のない JavaScript ファイルは、後回しにする必要があります。 JavaScript ファイルを手動で Breeze に追加したくない場合は、Autoptimize を試してください。
ユーザーが操作するまでインライン JavaScript を遅らせるため、Delay JS Inline Scripts をオンのままにします。 遅らせるために一般的に使用される JS ファイルのリストを確認してください (完全なファイルではなく、キーワードを入力します)。 AdSense、Analytics、Facebook Pixel、コメントなど、サードパーティの JS の多くはスクロールしなければ見えない位置で読み込まれます。
プリロード
Webfont のプリロード- 「プリロード キー リクエスト」の下で、PSI はどのフォントをプリロードするかを指示する場合がありますが、原則として、CSS ファイルにあるフォントのみをプリロードするか、フォールドの上にロードする必要があります。 CSS ファイルのプリロードにも使用できますが、その場合は注意して結果をテストしてください。
リンクのプリロード- これをオフにしないでください。 ユーザーがマウスをリンクの上に移動すると、そのページがバックグラウンドで読み込まれます。 ユーザーがリンクをクリックすると、ページはすぐに読み込まれたように見えます。 しかし、多くの訪問者が多数のリンクにカーソルを合わせると、CPU の負荷が高くなる可能性があります。
DNS 要求のプリフェッチ- 「サードパーティ コードの影響を軽減する」の PSI レポートを参照してください。 Web サイトに読み込まれるすべてのサードパーティ ドメインの URL をコピーして、ここに貼り付けます。 ただし、Google Fonts + CDN URL には事前接続を使用する必要があります。 これにより、ブラウザーはサードパーティのドメインを予測して読み込むのが少し速くなりますが、Web が全体的に改善されるわけではありません。
高度なオプション
ほとんどの場合、Never Cache URL は URL をキャッシュから除外するために使用されます (主に WooCommerce サイトなど)。 ここでそれらを除外する場合、Cloudways は、[アプリケーション設定] > [Varnish 設定] > [新しい除外を追加] に移動して、Varnish からも除外する必要があると言います。
クエリ文字列をキャッシュして、文字列 URL をキャッシュに保存します。 デフォルトでは、Breeze はクエリ文字列 (?model=mercedes のような URL) をキャッシュに保存しません。 それらをキャッシュに保存する必要がある場合は、ここに追加します。
「絵文字を無効にする」をオンにすると、小さな JS ファイルが削除されます (絵文字を使用する場合は、Unicode を使用してください)。
ハートビート API
Control Heartbeat をオフにしないでください。 Cloudways 分析 (Application > Monitoring の下) を見ると、admin-ajax が受け取っている要求が多すぎることがわかる場合があります。 Heartbeat API を無効にするか制限すると、これらのリクエストと CPU 使用率が低下します。 完全にオフにするのが最善ですが、他のユーザーが投稿やその他の Heartbeat API 機能を編集したときに、リアルタイムのプラグイン通知をオフにしても問題ないことを確認してください。
ここでは、ほとんどのサイトで必要ないはずなので、Heartbeat フロントエンドをオフにします。
Heartbeat Post Editorについては、5分ごとに自動保存されます。 自動保存が必要な場合は、ここで制限を設定できます。
また、バックエンドでハートビートを使用する必要がないため、ハートビートをオフにします。
データベース オプション
改訂後のクリーニングとは別に、私は他のすべてを行います。 特定の数の投稿リビジョンを保持するオプション (たとえば、バックアップがある場合は 5) と、定期的にスケジュールされたデータベースのクリーンアップを保持するオプションがあると、非常に役立ちます。 WP-Optimize は、他のキャッシュ プラグインと同様に、データベースのより完全なクリーニングを実行するために時々インストールする必要があります。 このようにして、どのプラグインまたはモジュールがデータベースに最も不要な負荷を引き起こしているかを特定し、それらが残した可能性のある長引くテーブルを削除できます。 Breeze も他のキャッシュ アドオンもこれを行いません。
CDN
CloudflareのCDNサービスを利用していない場合にのみ、CDNアクティベーションをオンにしてください。 Gijo Varghese のように、私は Cloudflare と BunnyCDN に依存しています (以下の彼の Facebook 投稿を参照してください)。 CDN URL を必要とするコンテンツ配信ネットワーク (CDN) を使用しない場合は、この手順を省略してください。
コンテンツ配信ネットワーク (CDN) がカスタム CNAME を採用している場合は、ここに入力します。 BunnyCDN プラグインを利用するだけでなく、キャッシュ プラグインに CDN URL を追加することで、提供されるアセットの数を増やすことができます。
CDN から素材を提供する場合、デフォルトのディレクトリは wp-includes と wp-content ですが、提供する必要があるディレクトリを指定することでさらに追加できます。
これをそのままにしておいてください。 通常、すべての静的ファイルを CDN から提供する必要があります。
相対パス URL (Web サイトの完全な URL) を使用する場合は、これをオフにしないでください。
ワニス
オンにすると、「Auto Purge Varnish」が見えないようにニスをきれいにします (Cloudways はそれを有効にするように言います)。
Varnish Server は、自動的に追加される Varnish サーバーの IP アドレスを示します。
サイトのデザインやその他の側面に変更を加え、まだ表示されていない場合は、Varnish Cache をクリアしてみてください。
最終的な考え
Cloudwaysは素晴らしいです。Breezeに切り替える前 (SiteGround から移動した後)、Vultr High Frequency をしばらく使用していました。 Breezeプラグインにもっと注意が払われれば、Cloudwaysはより魅力的なホストになると思います.
