炭火Blog

WordPressのブログを完全無料で高速化する全設定[Cloudflare]

※このページにはプロモーションが含まれています。

  1. Cloudflareをしばらく使った感想
  2. PageSpeed InsightsとGTmetrixの測定結果
  3. Cloudflareの設定

プラグインはできるだけ使わないようにしています。理由はプラグインの更新が止まった時に困らない為にと、WordPressを使っている時に広告が出るのが好きでは無いからです。

無料で利用できるCDNであるCloudflareを使う場合にプラグインを使わなくても、セキュリティの向上やアクセスの高速化はある程度の恩恵があります。

Cloudflareには無料で使えるFreeアカウントから始まり、月額制で価格が上がるほど高性能なCDNを利用できます。速度やカスタマイズ性、セキュリティの面からも差別化されていますが、個人のブログならFreeアカウントで十分のように感じます。

約1年間、Cloudflareを使いながら試行錯誤して現在の設定になりました。それなりに上手く使えているのではと考えてこの文章を書いていますが、私は専門家ではありません。この投稿の内容がすべての方にとって良い方法である確認はできません。もし同じように設定をされるなら、ご自分の環境で不具合や不利益が無いようにご注意をお願いします。

Cloudflareをしばらく使った感想

理屈から言えばプラグインでページキャッシュを作り、それをCDNで配信させれば動的にサイトを作成するWordPressの弱点である、アクセスされてからのページを作成する事でページの描写が遅くなるのは克服されます。

FreeアカウントではアクセスがあってCDNにキャッシュが残っても、すぐに消えるようです。当然ですが無料で使っている人にリソースは避けないのでしょう。

Freeアカウントの最大のメリットはオリジンサーバー(当ブログはシン・レンタルサーバー)のスペックが気にならなくなる点です。シン・レンタルサーバーならCloudflareを使わなくても問題なくブログの配信ができますが、そうでない弱いサーバーでも個人ブログならCloudflareの力で相当のアクセスは捌けるのではと思います。

Cloudflareを使ったページの読み込みをGoogle社のPageSpeed Insightsで測定する場合は、少し時間をおいて、複数回測定する必要があります。

当ブログのようにアクセスの少ないブログの場合はCDNにキャッシュが無いからです。一度測定をした時にキャッシュをし、二度目でキャッシュから配信をするので測定結果が速くなります。

逆に何度か測定しても速度が上がらない場合は、どこかの設定が間違えている可能性があります。

Amazonセールとイベント

PageSpeed InsightsとGTmetrixの測定結果

下の画像がPageSpeed InsightsとGTmetrixの測定結果になりますが、常にこの結果が出るというわけではなく、概ねこのくらいの速度になるとお考えください。

WordPressに追加したい機能がある場合はプラグインを使うのですが、このブログでは読み込み速度の低下を避けるためにプラグインは一切使用していません。

モバイルの測定結果
PageSpeed Insight モバイル
デスクトップの測定結果
PageSpeed Insights デスクトップ
GTmetrixの測定結果(Summary)
GTmetrix Summary
GTmetrixの測定結果(Waterfall)
GTmetrix Waterfall

Cloudflareの設定

Cloudflareの設定において、Freeアカウントでは使えない機能や、変更する必要がないと思う箇所は記載していません。高速化対策はできる限り行った上でCloudflareを使用する前提なのでRocket Loaderなどは使用していません。

Rocker LoaderやAlways Onlineなどの機能ははONにすると速度が落ちますが、ONにしたほうが速くなる場合はONにしてください。

キャッシュ設定

2025年7月にてページルールが使用できなくなるそうです。CloudflareによるとCache Everythingの設定はCache Rulesにて置き換え可能だそうです。

Page Rules migration guide | Cloudflare

下記のページルールについての記述は2025年7月になるまで使用可能となります。新たに設定する場合は後のCache Rulesを使う方法をお使いください。

ルール / ページルール(2025年6月まで利用可能)

URL (必須)https://xxxxxxxx.com/*
キャッシュ レベルCache Everything
オリジンキャッシュコントロールON
ブラウザ整合性チェックON
ブラウザキャッシュTTL1年
セキュリティレベル基本的にオフにする
エッジ キャッシュ TTL1日
IP ジオロケーション ヘッダーON
Cache Deception アーマーON

ページルールでCache Everythingを設定することでHTMLもキャッシュできるようです。すべてをキャッシュさせてから、管理画面などのキャッシュさせたくない部分を別途に設定します。

元々存在したページルールという設定はFreeアカウントでは3までしか使えませんでしたが、新たにキャッシュルールという設定項目が追加され、こちらは10項目の設定ができます。しかも同じ設定項目に複数のアドレスを設定できるので、Cache Everythingをページルールで設定し、それ以外はキャッシュルールで設定します。

https://xxxxxxxx.com/*はCloudflareを利用するサイト。

CSSとJavaScriptは圧縮してからアップロードするのでAuto MinifyはHTMLのみを使います。プラグインのCSSとJavaScriptが圧縮されてない場合は、そのようなプラグインを使わないのが一番ですが、そうも行かない場合は必要に応じてONにしてください。

ブラウザキャッシュTTLは1年に設定するとPageSpeed Insightで注意されなくなります。

セキュリティレベルは高くするほど安全になりますが、速度が落ちます。

エッジ キャッシュ TTLはCloudflareがキャッシュを保持する時間です。ニュースサイトのように頻繁にページが更新されるような場合は1秒に設定することもあるそうですが、1日に1回ランキングが書き換わるだけの当ブログでは24時間同じで構いません。また、上でも述べたように1日と設定してもその時間保持されるとは限りません。

Caching / Cache Rules

2025年7月になると使えなくなるページルール設定の代わりにCache Rules設定を使ってHTMLを含むすべてをキャッシュさせます。

ホスト名次を含むxxxx-xxxx.com
キャッシュの適格性キャッシュの対象
エッジ TTLキャッシュ制御ヘッダーを無視し、この TTL を使用します1日
ブラウザ TTLオリジンをオーバーライドしてこの TTL を使用します1年
再検証中に古いコンテンツを提供する更新中に古いコンテンツを提供しないON

キャッシュさせないページの設定です。管理画面をキャッシュさせてしまうと、上部に管理バーを表示させている場合は、ログインしてない状態でも管理バーが見えてしまうことがあります。ユーザー名が見えてしまうので管理画面や投稿ページのプレビューページなどはキャッシュの対象から外します。

Cookie次を含むwordpress_logged_in_
URIパス次を含む/feed/
URIクリエー次を含む?s=
URIパス次を含む/robots.txt
URIパス次を含む/sitemap.xml
URIパス次を含む/wp-login.php
URIクリエー次を含むpreview=true
URIパス次を含む/wp-admin/
キャッシュの適格性キャッシュをバイパスする
Cloudflare Cache Rule Settings

Cache Ruleは下に記述されている方が優先順位が上がるので、「preview=true」「/wp-admin/」の2つを最後に記述しないと、セキュリティ上の不都合が生まれます。

すべてをキャッシュさせる設定を「Cache」、キャッシュさせない設定を「Bypass」とした時の Cache Rulesにおける優先度は「Bypass」を高くします。Cache Rulesでは下に記述するほど優先度が高くなるので下の画像のように設定します。

キャッシュルールの優先度

Speed / 最適化

コンテンツの最適化BrotliON
Cloudflare FontsOFF
Early HintsON
Rocket LoaderOFF
プロトコルの最適化HTTP/2ON
HTTP/2 からオリジンON
HTTP/3 (QUIC 使用)ON
0-RTT 接続再開ON

BrotliはGzipより圧縮率の高い圧縮方法なのでONににします。効果があるかhttps://www.giftofspeed.com/gzip-test/で試してください。「Brotli Is Enabled」と表示されていれば効果があります。

Caching / 構成

キャッシュ レベルスタンダード
ブラウザ キャッシュ TTL既存のヘッダーを優先
Crawler HintsON
Always Online™OFF
開発モードOFF

Caching / 階層型キャッシュ / 階層型キャッシュ トポロジー / スマート階層型キャッシュ トポロジー

ONにします。

セキュリティ設定

セキュリティ / WAF

ソースIPアドレスリストに含まれない
URIパス次にある/wp-admin /wp-login.php /xmlrpc.php /wp-config.php

ルール テンプレート / ゾーン ロックダウンから許可する IP アドレスをカスタムリストに作成して、特定のIPアドレス以外からアクセスされないようにできます。

特にログイン画面にアクセスされないようできるのは、セキュリティ上ありがたいです。

IPアドレスを登録する場合IPv4の場合はそのままのアドレスを書けばよいのですが、IPv6の場合は

wwww:xxxx:yyyy:zzzz::/64

このようにアドレスの前半と「:/64」を組み合わせて登録するようです。カスタムリストを使わずにフルのIPv6を使ってアドレス制限をかけることはできますが、フルのIPv6の後半部分はコロコロ変化します。PCを再起動すれば必ず変わりますし、そうしなくても変わりますので、「:/64」を使うことをお勧めします。

ルール / 変換ルール / レスポンス ヘッダーを変更

次の場合…受信リクエストが一致する場合…すべての受信リクエスト
スタティック設定Content-Security-Policybase-uri ‘self’; object-src ‘none’; frame-ancestors ‘self’
スタティック設定Cross-Origin-Opener-Policysame-origin-allow-popups
スタティック設定Permissions-Policygeolocation=(),microphone=(),camera=()
スタティック設定X-Content-Type-Optionsnosniff

Content-Security-Policyはサイトを表示させるソースを限定してセキュリティを高めます。PageSpeed Insightで提案される内のscript-srcは、JavaScriptのソースを制御するのですがGoogle AdsenseがContent-Security-Policyに対応していない(使用するアドレスが多すぎる上に、日々変更される)ので設定できません。

それ以外は説明を理解できたもので当ブログで不具合が起きていないものだけを記載しています。

セキュリティ / ボットボット / ファイト モード

ONにします。

最後までお読みくださり、誠にありがとうございます。

國本知里 監修 2023.11.24
ベストセラー5位- パソコン辞事典
クリエイターのためのChatGPT活用大全:創作の幅が一気に広がる!
池田 朋弘 著
ベストセラー3位- 秘書
ChatGPT最強の仕事術

関連投稿

週間アクセスランキング

管理者 ほんだ

数多くあるブログの中で、このページをお読みくださりありがとうございます。このブログは、炭火で美味しいものを作ることを中心に、日々の趣味についてを文章にすることで、WordPressを使ってのWebページ作成を忘れないようにしています。熱帯魚の世話や野菜の栽培、Linuxについて興味のあることを、つたない文章で綴っています。兵庫県在住です。

Home
Blogging
WordPressのブログを完全無料で高速化する全設定[Cloudflare]