Skip to content

非公式本サイトは非公式の日本語ドキュメントであり、Cloudflare 公式サイトではありません。最新情報はdevelopers.cloudflare.comをご確認ください。

WordPress の高速化とパフォーマンス改善

最終更新 Markdown で表示Agent セットアップ

Cloudflare の CDN は、巨大なグローバルネットワークでコンテンツをキャッシュできます。ただし、パフォーマンスは静的ファイルを訪問者の近くに置くことだけではありません。Cloudflare は CDN 以上の機能を提供します。最適化機能を使うと、従来の CDN では難しいレベルまで WordPress サイトのパフォーマンスを高められます。

匿名ページビューのキャッシュ

匿名ページビュー向けのキャッシュルールを作成する様子。

Cloudflare の「Bypass Cache on Cookie」機能を使うと、ログインしていないページを Cloudflare が完全にキャッシュできます。HTML が実質的に静的なページを再生成しなくて済むため、サーバーの時間とリソースを節約できます。一方で動的な動作は妨げません。ユーザーが WordPress ダッシュボードにログインしたり、WooCommerce に商品を追加したりすると、エッジキャッシュはバイパスされます。

画像の最適化

画像はページ読み込み時間を大きく悪化させることがあります。Cloudflare を使うと、画像の読み込み時間を大幅に短縮できます。これらの機能は、Cloudflare ダッシュボードの Speed > Settings > Image Optimization にあります。

Polish を有効にすると、画像を圧縮してメタデータを取り除き、画像とウェブページの読み込み時間を大幅に改善できます。Lossless はほとんどのメタデータ(例: EXIF データ)を取り除きますが、画像の詳細は変えません。Lossy はほとんどのメタデータを取り除き、画像を約 48% 圧縮します。

HTTP/2 を有効にする

HTTP/2 では、多重化やヘッダー圧縮など、多くのパフォーマンス機能を使えます。WordPress サイトで HTTP/2 を有効にするには、サイトを HTTPS で読み込むようにします。

SSL を有効にしたあと、ユーザーが HTTPS 版へリダイレクトされるようにして、HTTP/2 で読み込まれるようにします。Always use HTTPSPage Rule で設定できます。

WordPress サイトが HTTP/2 で正しく読み込まれるようにする Page Rule を作成します

Cloudflare の WordPress plugin を使うと、HTTP/2 Server Push で必要なアセットをユーザーへプッシュできます。CSS と JavaScript の読み込みに必要なラウンドトリップを大幅に減らせます。設定手順は WordPress で HTTP/2 Server Push を有効にする方法 を参照してください。

アセットの縮小

ビルドプロセスで Grunt や Gulp を使っている場合は、ビルドで minify を実装できます。

HTTP/2 はリクエストを多重化するため、CSS や JavaScript ファイルの結合や、サーバー上で結合する処理の導入は推奨しません。

高度なパフォーマンスツール

Enterprise ユーザーは、HTML ヘッダーからの URL プリフェッチカスタムキャッシュキー を使ってキャッシュを強化できます。

役に立ちましたか?