ウェブサイトをクリックしてもイライラしているように感じるのを待ってからイライラするのではなく、戻るボタンをクリックしてもイライラすることはありません。 真実は、サイトを訪れる人を悩ます以上のことはほとんどありません。 ロードが遅いウェブサイト そしてそれはどこです WPロケット 入って来る
Forrester Consultingの調査によると、 “ 47%の消費者は、2秒以内にウェブページがロードされると予想しています”.
悲しいことに、多くのウェブサイトの所有者は遅いロードのウェブサイトが人々の地獄を失望させるだけでなく、それはまたあなたのグーグルのランキングに悪影響を及ぼし、そして収益に影響を及ぼします。
良いことは、特にWebサイトが搭載されている場合、Webサイトの読み込み時間を短縮する方法があることです。 WordPress. ここから始めましょう。 WPロケット (はい それは私が使うプラグインです 私のウェブサイトをスピードアップするために)。
WPロケットとは何ですか?
WPロケット プレミアムです WordPress ウェブサイトの読み込み時間を高速化するのに非常に効果的なキャッシュプラグイン。
WP Rocketのプランと価格
- $ 49 /年 - 1年のサポートと更新 1のウェブサイト.
- $ 99 /年 - 1年のサポートと更新 3のウェブサイト.
- $ 249 /年 - 1年のサポートと更新 無制限のウェブサイト.
他のほとんどとは異なり WordPress キャッシング 紛らわしいオプションや設定が満載されていることで有名なプラグイン。 WP Rocketの詳細と、いくつかの WP Rocketに代わる最良の代替手段.
1。 WP Rocketのダウンロードとインストール
まず、 WP RocketのWebサイト そして購入する WordPress プラグイン。
自分に最適なプランを選択して、注文に必要な手順を完了してください。
次に、あなたはwp-rocket.meであなたのアカウントにログイン情報を含むEメールを送られるでしょう。 ログインしてログイン "マイアカウント" ダウンロードリンクがあります。 zipファイルをダウンロードしてコンピュータに保存します。
次に、にログインします WordPress サイトに行きます プラグイン->新規追加->プラグインのアップロード.
WP Rocketのzipファイルバージョンをアップロードしてインストールするだけです。
最後に、WP Rocketを起動して起動すると、プラグインがインストールされました。 わーい!
2。 WP Rocketベスト&推奨設定
それでは、推奨設定に従ってWP Rocketを設定しましょう。
最初に行く 設定-> WP Rocketそして、あなたはプラグインの設定ページに移動します。 10のタブまたはセクションには、以下のために設定を構成および調整する必要があります。
- ボーナス: HTTP / 2用のWP Rocketの設定
- ボーナス: KeyCDNでWP Rocketを使う
- ボーナス: どのWebホストがWP Rocketと互換性があり、動作しますか?
- ボーナス: WP Rocketの設定ファイルをダウンロードする
それでは、10セクションごとに、WP Rocketの推奨設定を構成していきます。
WPロケットダッシュボード
ダッシュボードには、ライセンスに関する情報と有効期限が表示されます。 また、オプトインして ロケットテスター (ベータテストプログラム)そして ロケット分析 (WP Rocketが匿名でデータを収集できるようにする)。 ここにはWP Rocketに関するサポートへのリンクとよくある質問もあります。
ダッシュボードでは、次のことができます。 キャッシュファイルをすべて削除する (WP Rocketの設定が完了したら、実行することをお勧めします)、 キャッシュプリロードの開始 (あなたのホームページとそのホームページ上のすべての内部リンクのキャッシュを生成します) OPcacheをパージする コンテンツ(WP Rocketプラグインをアップデートするときの問題を防ぐためにOPcahceをパージします)。
WPロケットキャッシュ設定
1 モバイルデバイスのキャッシュを有効にする モバイルデバイスのキャッシングが有効になり、Webサイトがモバイルに適したものになるため、有効にする必要があります。
また選択 モバイルデバイス用の個別のキャッシュファイル。 WP Rocketのモバイルキャッシングは両方のオプションが有効になっていると最も安全に機能するからです。 疑問がある場合は、両方を守ってください。
2。 ログインのキャッシュを有効にする WordPress users、これはあなたが会員制のサイトを持っているとき、またはユーザーがコンテンツを見るためにログインしなければならないときに同様のことをアクティブにしたことをお勧めします。
3 キャッシュ寿命 これは自動的に10時間に設定されます。つまり、キャッシュされたファイルは10時間後に自動的に削除されてから再作成されます。 あなたがあなたのサイトを更新することがめったにないか、または多くの静的コンテンツを持っているなら、あなたはこれを増やすことができます。
完全に保存してテストしてください。 あなたのウェブサイトで何かが壊れているのに気づいたら設定を無効にしてください。
WP Rocket CSSおよびJSファイルの最適化設定
ファイルを縮小する ファイルサイズを小さくしてロード時間を短縮できます。 縮小は、静的ファイルからスペースとコメントを削除し、ブラウザと検索エンジンがHTML、CSS、およびJavaScriptファイルをより高速に処理できるようにします。
ファイルを結合する テーマ/プラグインの互換性とパフォーマンスの向上を確実にするために、ファイルを小さなグループに連結します。 ただし、1-6サイズの大きいファイルよりも、ブラウザで1サイズの小さいファイルを並行して高速でダウンロードするため、2単一ファイルのみに連結することはお勧めできません。
1 HTMLファイルを縮小する あなたのサイトのウェブページのサイズを減らすために空白とコメントを削除します。
2 Google Fontsファイルを結合する (特に複数のフォントを使用している場合)HTTPリクエストの数を減らします。
3 クエリ文字列を削除する 静的リソースからGT Metrixのパフォーマンスグレードを向上させることができます。 この設定は静的ファイル(例えばstyle.css?ver = 1.0)からバージョン問い合わせ文字列を削除し、代わりにそれをファイル名にエンコードします(例えばstyle-1-0.css)。
4 CSSファイルを縮小する スタイルシートのファイルサイズを減らすために空白とコメントを削除します。
5 CSSファイルを結合する すべてのファイルを1つのファイルにマージすると、HTTPリクエストの数が減ります。 あなたのサイトがHTTP / 2を使用している場合はお勧めできません。
重要: これは物事を破る可能性があります! この設定を有効にした後にWebサイトでエラーが発生した場合は、再度無効にすると、サイトは通常の状態に戻ります。
6 CSS配信を最適化する あなたのウェブサイト上のレンダリングブロッキングCSSを排除して、より速いロード時間を知覚します。 これは、CSSスタイルがなくてもページの読み込みが開始されることを意味します。これは、ページ速度を「スコア化」する際にGoogle PageSpeed Insightsが考慮に入れるものです。
クリティカルパスCSSはあなたのページがすべてのCSSスタイルなしでロードを開始することを意味します。 それはロード中に少しの間ちょっと変に見えるかもしれないことを意味します。
これが呼び出されます FOUC(スタイルのないコンテンツのフラッシュ)。 これを回避するには、クリティカルパスCSSと呼ばれるものを使用する必要があります。 これは、ページのロード中にFOUCを回避するために、ページ上部のコンテンツのCSSを直接HTMLに配置する必要があることを意味します。
クリティカルパスCSSを生成するためにあなたは使うことができます このクリティカルパスCSSジェネレータツール.
7 JavaScriptファイルを縮小する 空白とコメントを削除してJSファイルのサイズを小さくします。
8 JavaScriptファイルを結合する あなたのサイトのJavaScriptの情報をより少ないファイルにまとめ、HTTPリクエストを減らします。 あなたのサイトがHTTP / 2を使用している場合はお勧めできません。
重要: これは物事を破る可能性があります! この設定を有効にした後にWebサイトでエラーが発生した場合は、再度無効にすると、サイトは通常の状態に戻ります。
9 JavaScriptのロードを延期する あなたのサイトのレンダリングをブロックするJSを排除し、ロード時間を改善することができます。 これは、Google PageSpeed Insightsがページ速度を「スコアリング」する際に考慮に入れるものです。
10 JQueryのセーフモード ドキュメントおよびドキュメントの先頭にレンダリングブロックスクリプトとしてjQueryをロードすることで、テーマおよびプラグインからのインラインjQuery参照を確実にサポートします。
完全に保存してテストしてください。 あなたのウェブサイトで何かが壊れているのに気づいたら設定を無効にしてください。
WPロケットメディア設定
1 遅延ロード画像 つまり、画像はビューポートに入るとき(または入力しようとしているとき)にのみ読み込まれます。つまり、ユーザーがページを下にスクロールしたときにのみ読み込まれます。 遅延ロードはHTTPリクエストの数を減らし、ロード時間を改善することができます。
(レイジーロードが有効になっているときに、レイジーロードされた画像の下の位置を指すアンカーリンクがWebページの間違った位置にスクロールするため、画像のレイジーロードを無効にすることがあります)
2 iframeとビデオを遅延ロードする つまり、iframeと動画は、ビューポートに入るとき(または入力しようとしているとき)にのみ読み込まれます。つまり、ユーザーがページをスクロールダウンしたときにのみ読み込まれます。 遅延ロードはHTTPリクエストの数を減らし、ロード時間を改善することができます。
3 YouTubeのiframeをプレビュー画像に置き換える ページにYouTubeの動画がたくさんある場合は、読み込み時間を大幅に短縮できます。
Lazyloadは個々のページ/投稿でオフにすることができます(あなたは投稿/ページサイドバーにこの設定を見つけます)
4 絵文字を無効にする から訪問者のブラウザのデフォルトの絵文字を使用する必要があるため、無効にする必要があります WordPress.org。 絵文字のキャッシュを無効にすると、HTTPリクエストの数が減り、読み込み時間を改善できます。
6. WordPress 埋め込む 他の人があなたのサイトからコンテンツを埋め込むことを防ぎ、またあなたが他のサイトからコンテンツを埋め込むことを防ぎ、関連するJavaScriptリクエストを削除するため、無効にする必要があります WordPress 埋め込みます。
完全に保存してテストしてください。 あなたのウェブサイトで何かが壊れているのに気づいたら設定を無効にしてください。
WPロケットプリロード設定
1 サイトマップのプリロード キャッシュの有効期限が切れてキャッシュ全体がクリアされたときに、XMLサイトマップ内のすべてのURLをプリロードに使用します。
2 Yoast SEO XMLサイトマップ。 WP Rocketは、によって生成されたXMLサイトマップを自動的に検出します。 Yoast SEO Plugin。 あなたはそれをプリロードするオプションをチェックすることができます。
3 プリロードボット パフォーマンスの良いサーバーでのみアクティブにして使用する必要があります。 有効化されると、Webサイトのコンテンツを追加または更新した後に自動的にトリガーされます。 これが高いCPU使用率またはパフォーマンスの問題を引き起こしている場合は手動に変更します。
新しい投稿またはページを作成または更新すると、WP Rocketはその特定のコンテンツとそれに関連する他のコンテンツのキャッシュを自動的に消去します。 プリロードボットはこれらのURLをクロールして直ちにキャッシュを再生成します。
4 DNS要求をプリフェッチする 実際のページコンテンツの取得と並行してではなく、並行してドメイン名の解決を行うことができます。
DNSのプリフェッチにより、特にモバイルネットワークでは外部ファイルの読み込みが速くなるため、プリフェッチされる外部ホスト(//fonts.googleapis.comや//maxcdn.bootstrapcdn.comなど)を指定できます。
プリフェッチする最も一般的なURLは次のとおりです。
- //maxcdn.bootstrapcdn.com
- //platform.twitter.com
- //s3.amazonaws.com
- //ajax.googleapis.com
- //cdnjs.cloudflare.com
- //netdna.bootstrapcdn.com
- //fonts.googleapis.com
- //connect.facebook.net
- //www.google-analytics.com
- //www.googletagmanager.com
- //maps.google.co.jp
完全に保存してテストしてください。 あなたのウェブサイトで何かが壊れているのに気づいたら設定を無効にしてください。
WP Rocketの高度なルール設定
これらの設定は高度なキャッシュ管理のためのもので、通常はeコマースサイトのカートページとチェックアウトページを除外するためのものです。
1 URLをキャッシュしない 決してキャッシュされるべきではないページまたは投稿のURLを指定できます。
2 クッキーをキャッシュしない 訪問者のブラウザで設定されたときに、ページがキャッシュされないようにするクッキーのIDを指定できます。
3 ユーザーエージェントをキャッシュしない キャッシュされたページを表示しないようにするユーザーエージェント文字列を指定できます。
4 常にURLを削除する 投稿やページを更新するたびに常にキャッシュから削除するURLを指定できます。
5 クエリ文字列をキャッシュする キャッシュ用のクエリ文字列を指定できます。
完全に保存してテストしてください。 あなたのウェブサイトで何かが壊れているのに気づいたら設定を無効にしてください。
WPロケットデータベース設定
このセクションには、クリーンアップおよび最適化するためのさまざまな設定が含まれています WordPress.
1 クリーンアップ後 リビジョン、自動ドラフト、ゴミ箱への投稿やページを削除します。 古いバージョンの投稿(または削除された投稿)がない限り、これらを削除してください。
2 コメントの整理 スパムやゴミ箱へのコメントを削除します。
3 トランジェントのクリーンアップ ソーシャルカウントのように保存されているデータを削除しますが、一時的に期限切れになってもデータベースに残っているため安全に削除できる場合があります。
4 データベースのクリーンアップ あなたのテーブルを最適化します WordPress データベース。
5 自動クリーンアップ。 通常、アドホックベースでクリーンアップを行いますが、データベースの自動クリーンアップを実行するようにWP Rocketをスケジュールすることもできます。
データベースの最適化が実行されると元に戻す方法はないため、クリーンアップを実行する前にデータベースをバックアップするのが理想的です。
WPロケットCDN設定
コンテンツ配信ネットワーク(CDN)を使用すると、静的ファイル(CSS、JS、画像)のすべてのURLが、指定したCNAMEに書き換えられます。
1 CDNを有効にする。 コンテンツ配信ネットワークを使用している場合はこれを有効にします。 WP Rocketは、Amazon Cloudfront、MaxCDN、KeyCDN(私が使っている)などのほとんどのCDNと互換性があります。 方法についてもっと知る CDPでWP Rocketを使う
2 CDN CNAME。 CDNプロバイダから提供されたCNAME(ドメイン)をコピーしてCDN CNAMEに入力します。 これはあなたのアセット(静的ファイル)のすべてのURLを書き換えます。
3 ファイルを除外する CDNで配信されるべきではないファイルのURLを指定できます。
完全に保存してテストしてください。 あなたのウェブサイトで何かが壊れているのに気づいたら設定を無効にしてください。
WP Rocketアドオン(Cloudflare)
WP RocketはあなたのCloudflareアカウントをそれらのアドオン機能と統合させます。
1 グローバルAPIキー。 Cloudflareアカウントの右上にAPIキーがあります。 プロファイルに移動して下にスクロールすると、グローバルAPIキーが表示されます。 これをコピーしてWP Rocketに貼り付けるだけです。
2 アカウントのEメール。 これはCloudflareアカウントに使用するEメールアドレスです。
3 ドメイン。 これはあなたのドメイン名、例えばwebsitehostingrating.comです。
4 開発モード。 Webサイトで開発モードを一時的に有効にします。 この設定は、3時間後に自動的にオフになります。 あなたがあなたのサイトにたくさんの変更を加えているとき、これは良いことです。
5 最適な設定。 速度、パフォーマンスグレード、および互換性のためにCloudflare設定を自動的に強化します。 このオプションは最適なCloudflare設定を有効にします。
6 相対プロトコル。 Cloudflareの柔軟なSSL機能でのみ使用する必要があります。 静的ファイル(CSS、JS、画像)のURLは、http://またはhttps://の代わりに//を使用するように書き換えられます。
WPロケットツール
1 設定をエクスポート WP Rocketの設定をエクスポートして他のサイトで使用することができます。
2 設定をインポートする 事前設定されたWP Rocket設定をインポートできます。
3 ロールバック WP Rocketの新しいバージョンによって問題が発生した場合は、前のバージョンに戻すことができます。
HTTP / 2用のWP Rocketの設定
HTTP / 2 Webサーバとブラウザ間の通信を管理するために1999以来使用されてきたHTTPへのアップグレードです。 HTTP / 2は、データ圧縮の改善、要求の多重化、およびその他の速度の向上を通じて、ページの読み込みを高速化するための道を開きます。
多くのサーバーやブラウザはHTTP / 2とほとんどのWebホストをサポートしています。 SiteGroundのような、今HTTP / 2をサポートします。 この HTTP / 2チェッカー あなたのサイトがHTTP / 2を使用できるかどうかを教えてくれます。
あなたのサイトがHTTP / 2を使用することができるならば、それはあなたがそれのためにWP Rocketを構成することができる方法です。
すべてのCSSファイルとJSファイルをできるだけ少ないファイルに連結(結合)する HTTP / 2のベストプラクティスではありません WP Rocketは ファイル連結をアクティブにしない の中に ファイル最適化タブ.
WP Rocketはあなたにお勧めします これら2つのボックスをチェックしないでください。 詳細は WPロケットに関するこの記事.
WCD RocketとKeyCDNの使い方
KeyCDNを使ったWP Rocketの設定はとても簡単です。 (FYI KeyCDN 私が使用して推奨するコンテンツ配信ネットワークです。
最初にプルゾーンを作成します KeyCDN。 その後、 CDNタブ チェックして コンテンツ配信ネットワークを有効にする オプションを選択します。
それでは、 サイトのホスト名を:に置き換えます。 KeyCDNダッシュボードから取得したURLのフィールド(作成したプルゾーンの[ゾーン]> [ゾーンURL]の下。URLは次のようになります。 lorem-1c6b.kxcdn.com)
あるいは、推奨されるオプション CNAMEを使用 選択したURLの例(https://static.websitehostingrating.comなど)
どのWebホストがWP Rocketで動作しますか?
WP Rocketは、ほとんどすべてのWebホストと互換性があります。。 ただし、特に管理されているもの WordPress ホストは、WP Rocketでは動作しない可能性があります。 ホスティングプロバイダーが以下にリストされていない場合、これはWP Rocketと互換性がないという意味ではありません。 100%を確実にする最善の方法は、Webホストに連絡して尋ねることです。
- キンスタ:KinstaはWP Rocketバージョン3.0以降のみをサポートしています。 WP Rocketのページキャッシュは、Kinstaの組み込みキャッシュとの競合を防ぐために自動的に無効にされています。 Kinstaはオフィシャルパートナーです WPロケット
- WPのエンジン:WP RocketはWP Engineで許可されている唯一のキャッシングプラグインです。 WP Engineはオフィシャルパートナーです WPロケット
- Sitegroundは:WP RocketはSiteGroundの静的、動的、およびmemcachedキャッシングと互換性があります。 SiteGroundはオフィシャルパートナーです WPロケット
- A2ホスティング:WPロケットは A2ホスティングと完全互換。 しかし、インストールする必要があります WordPress WP Rocketプラグインをインストールする前に、サイトで。 A2 Hostingは、WP Rocketの公式パートナーです。
- WebHostFace:WebHostFaceはWP Rocketをサポートしています(そしてその公式パートナーです)。
- Savvii:SavviiはWP Rocketをサポートしています(そしてその公式パートナーです)。
- FastComet:専用に最適化されたパッケージを提供します WordPress およびWP Rocket。 FastCometはオフィシャルパートナーです WPロケット
- Bluehost Managed WordPress 予定:Bluehost Managed WordPress Varnish構成がWP Rocketのミニフィケーションを破壊することを計画しているため、オフにする必要があります ブルーホストのニスまたは、WP Rocketの縮小をオフにします。
- 曇り WordPress ホスティング:WP Rocketの縮小をCloudwaysのVarnishと併用する場合は、Cloudwaysアプリケーション設定でVarnishの除外ルールを作成する必要があります。
- フライホイール:フライホイールサポートに連絡してWP Rocketを有効にするように依頼してください。
- HostGator Managed WordPress 予定:WP Rocketは禁止されています HostGator Managed WordPress ホスティング.
- 合成:W3 Total CacheはSynthesisにプレインストールされていますが、削除してWP Rocketに置き換えることができます。
- WebSavers.ca:WebSavers.caはWP Rocketのオフィシャルパートナーです。
WP Rocketと互換性のあるウェブホストについてもっと読む https://docs.wp-rocket.me/article/670-hosting-compatibility.
WP Rocketの設定ファイルをダウンロードする
私は自分のサイトで私が使っているのと同じWP Rocket設定を追加することをとても簡単にしました。 単に このWP Rocket設定ファイルをダウンロードする そしてWP Rocket管理者のツールセクションにそれをインポートします。
のコピーを購入 WPロケット そしてそれから WP Rocketの設定ファイルをダウンロードする そして私がこのサイトで推奨し使用している正確な設定をインポートします。
3。 WP Rocketヘルプと公式ドキュメント
あなたが何らかの理由でWP Rocketに関する問題に遭遇した場合、以下で利用可能な有用な情報がたくさんあります。 WP Rocketのウェブサイト。 あなたの購入でも1年のサポートを受けることを忘れないでください。
これが私が最も参考になったWP Rocketチュートリアルのリストです:
- 使ってみよう
- ホスティングの互換性
- WP Rocketがあなたのページをキャッシュしているかどうかをチェックする方法
- WPロケットでのSSL
- CDN付きWPロケット
- クラウドフレアとWPロケット
- 500内部サーバーエラーの解決
- 縮小化に関する問題の解決
- WPロケットのNGINX設定
あなたの使用経験は何ですか? WP Rocketキャッシングプラグイン WordPress? 重要な情報はありませんか。 私は以下のコメントでそれについてすべてを聞きたいです!
このWP Rocketセットアップチュートリアルが役に立つと思った場合は、ソーシャルで共有することをお勧めします。
独自の設定を共有していただきありがとうございます。 私はそれを使うのが好きです https://dearbusiness.com
しかし、構成はcloudflareとHTTP / 2に基づいていますか?
感謝
アブ
こんにちはアブ…Cloudflareいいえ、HTTP / 2はい(CSSとJSファイルは結合されません)
こんにちは、
記事をありがとう!!
css配信の最適化および遅延JavaScriptの読み込みから要素ファイルを除外するにはどうすればよいですか?
どうもありがとうございました。 神のお恵みがありますように
うわー、素敵な仕事
それを買っただけでちょっと道に迷った。 私たちが知っておくべきことすべての素晴らしいまとめ
Pingdomによると、私は2.4から0.864に行きました。 本当に印象的なプラグイン。
難しい部分はW3TCを正しく削除し、サーバーに残っていたものです。
この素晴らしい記事をありがとう
こんにちはXavうわー、すごいです、2.4sから0.86sは非常に印象的な改善です!