Flying Pages 先読み高速化プラグインの使い方|WordPress

ソフトウエア
知りたいこと。解決できること
  • WordPressサイトを高速化したい
  • WordPressサイトの読み込みが遅い
  • PageSpeed Insights の点数が低い

この疑問に回答します。

WordPressのサイトで PageSpeed Insights の点数がモバイルだけ低い。どうやって高速化させて解決するか分からない。プラグインを利用して手軽に高速化する方法を探している方に向けて解説します。

プラグインを利用するのでミスすることもありませんので手軽に試してみてください。

WordPress プラグイン Flying Pages とは

Flying Pages は、ページ内のリンク先を先読みし表示を高速化するプラグインです。

通常は、ウェブページを開くとブラウザは必要なデータを取得して画面に表示します。必要なデータをすべて取得すると待機状態になります。ユーザーがページ内のリンクをクリックして別ページに遷移すると、ブラウザはリンク先のデータを読み込み始まます。

Flying Pages は、表示するウェブページのデータ読み込みが終わると、自動的にリンク先のウェブページを読み込み始めます。ユーザーがリンクをクリックすると、既にデータ読み込みが完了しているので、高速にページ遷移が完了します。

自動的にデータの先に読み込む機能をプレロード(preload)といいます。

プレロード(preload)は、高速化するために利用される一般的な方法です。

Flying Pages のメリット

WordPressで構築された、どのサイトでも利用することが出来ます。プラグインを導入するだけで高速化することが手軽にできます。

  • 手軽に高速化することができる

他のプラグインに影響を受けることなく手軽に利用することが可能です。

ただ、プレロード機能(先読み)による高速化は効果を体感するのが難しいです。最近のレンタルサーバーは高性能なので効果を体感できないのが残念ですが、確実に高速化が図られています。

Flying Pages のデメリット

Flying Pages のプレロード機能(先読み)は、ページ内のリンク先を先読みして高速化するものです。ウェブページそのものを高速化するものではありません。

つまり、PageSpeed Insights の点数アップに直接は結びつきません。

ウェブページのリンク先を先読みするのでトラフィック量が増加します。PCの場合はトラフィック量は気にならないと思いますが、モバイル通信の場合であれば抵抗を感じる方もいると思います。

ただ、最近のサイトはモバイル対策を実施されているので、読み込むデータは少なくなりました。誰もが高速化を目指している証拠です。

また、ウェブページ内に大量のリンクが貼っている場合は、プレロード機能(先読み)が終了する前にユーザーがリンクをクリックしてしまい、プレロードの意味が全くない場面が発生します。

  • PageSpeed Insights の点数アップに直接結びつかない
  • トラフィック量が増加する
  • プレロード(先読み)が完了する前にページ遷移が発生する

Flying Pages のインストール手順

Flying Pages のインストール手順を説明します。WordPress のプラグイン導入はとても簡単です。

ダッシュボードから「プラグイン」 > 「新規追加」に進みます。

右上の検索窓から「Flying Pages」と入力すると、プラグインが表示されます。

あとは、「今すぐインストール」 と「有効化」を実行するだけです。

Flying Pages のインストール手順
Flying Pages のインストール手順

Flying Pages のインストール手順はこれで終了です。デフォルト設定で問題なく動作します。細かな設定が判らないのであれば、設定変更なしで全く問題ありません。

この手軽さが重宝します。

Flying Pages の設定

Flying Pagesはデフォルト設定のままで十分に動作します。ただ、パラメーターの意味を理解して変更することには重要なので紹介します。

ダッシュボードの「設定」 > 「Flying Pages」から、Flying Pagesの詳細設定を行います。

Flying Pages のインストール手順
Flying Pages のインストール手順

Delay to start preloading | 開始遅延

ウェブページの読み込みを開始するタイミングを制御します。

0~30秒の間隔でプレロード機能(先読み)を遅延させることができます。

規定値:0 [秒]

Max requests per second | 最大リクエスト数

ブラウザが1秒あたりにサーバーに送信する必要のある最大リクエスト数を制御します。

規定値:3 [リクエスト]

Preload only on mouse hover | マウス操作

マウスがリンク先に触れたらリンクのプリロードを開始します。

規定値:なし

Mouse hover delay | マウス操作開始遅延

マウスがリンク先に触れたらリンクのプリロードを開始するタイミングを制御します。

規定値:50 [ms]

Ignore keywords | 除外キーワード

プリロードしないリンクをキーワード指定することができます。

Disable for logged in admins | ログインユーザーの無効化

WordPressにログインしているユーザーのプリロードを無効にすることができます。

規定値:なし

まとめ

Flying Pages はプレロード機能(先読み)によりウェブページの高速化を実施します。つまり、ウェブページ自身を高速化するものではありません。理解して利用するとユーザービリティが向上します。

  • プレロード機能によりウェブページの高速化
  • PageSpeed Insights の点数アップに直接結びつかない
  • ページ内にリンク数が多いと向かない
  • 有効化するだけで使用できる

ウェブサイトの高速化は、このプラグインだけでなくPageSpeed Insights に直接関係する「キャッシュ」や「Lazy Load」など他の技術も併用することを検討してください。

ページ遷移の高速化は数値に表しにくいものですが、ユーザーにとってメリットがあるので導入をおススメします。

関連記事 Flying Scripts – JavaScript 読み飛ばし高速化プラグインの使い方

関連記事 WordPress高速化 | PageSpeed Insightsモバイル100点へのロードマップ

コメント