WordPressプラグインがサイトのロード時間に与える影響(明らかに)

よくある話です。魅力的な新機能を追加できる完璧なプラグインを見つけたのに、ウェブサイトの動作が極端に遅くなり、その興奮がすぐにイライラに変わってしまいます。私たちはその経験があり、機能とスピードのどちらかを選ばなければならないのかと悩むのがどれほどストレスになるかを知っています。

10年以上にわたりWPBeginnerやその他の高トラフィックサイトを管理してきた経験から、パフォーマンスに関する真実を学びました。問題はプラグインの数ではなく、その質と設定方法にあることがほとんどです。

このガイドは、プラグイン関連の速度問題を診断および修正するために私たちが使用している、具体的で実践的な方法を共有するために作成しました。成長に必要なツールを犠牲にすることなく、サイトを高速に実行し続ける方法を学びます。

WordPressプラグインがサイトのロード時間に与える影響

これは、プラグインとWordPressのパフォーマンスに関する包括的なガイドです。この記事をナビゲートするには、以下のリンクを使用してください。

  1. WordPressプラグインはどのように機能しますか?
  2. プラグインがサイトのロード時間にどのように影響するか
  3. プラグインが多すぎるとWordPressは遅くなるか?
  4. 非アクティブなプラグインはWordPressを遅くしますか?
  5. より高速なプラグインを選択する方法
  6. プラグインオーガナイザーを使用してプラグインを制御する方法
  7. WordPressプラグインによって読み込まれるファイルをチェックする方法(上級者向け)
  8. WordPressプラグインアセットを手動で最適化する方法(上級者向け)
  9. WordPressでプラグインのスタイルシートを無効にする方法(上級者向け)
  10. WordPressでプラグインのJavaScriptを手動で無効にする方法(上級者向け)
  11. 特定のページでのみスクリプトを読み込む方法(上級者向け)
  12. WordPressプラグインとサイトの速度に関するよくある質問
  13. ウェブサイトを高速化するための追加リソース

WordPressプラグインはどのように機能しますか?

WordPressプラグインは、WordPressサイトのアプリのようなものです。お問い合わせフォーム、フォトギャラリー、eコマースストアなどの追加機能のためにインストールできます。

WordPressコアとプラグインはどちらも PHPで記述されています。このPHPコードはウェブサーバー上で実行され、そのリソースを使用します。

そのため、サーバーリソースを簡単に管理し、サイトを効率的に実行できる高速なWordPressホスティングを選択することが重要です。

ウェブサイトに誰かがアクセスすると、WordPressはまずコアファイルを読み込み、次にアクティブなすべてのプラグインを読み込みます。WordPressプラグインとその仕組みに関するガイドで詳細を確認できます。

プラグインがサイトの読み込み時間にどのように影響するか

そのため、WordPressプラグインは機能を追加するのに素晴らしいですが、ウェブサイトのリソースも使用するため、サイトの読み込み速度に影響を与える可能性があります。

その方法の1つは、ウェブサイトのデータベースで情報を検索または保存することです。プラグインが常に大量のデータを取得する必要がある場合、またはデータベースリクエストが効率的でない場合、サーバーが訪問者のリクエストに応答する速度が低下する可能性があります。

より一般的には、プラグインは、訪問者のブラウザがダウンロードする必要がある 追加ファイル を追加することで速度に影響を与えます。これらのファイルには、プラグインの外観を制御する スタイルシート (CSS)、インタラクティブな機能のための JavaScript (JS)、および場合によっては 画像 やフォントが含まれることがよくあります。

WordPressキャッシュプラグイン

理想的には、プラグインはこれらのファイルを必要とされる場所と時にのみ読み込むべきです。例えば、お問い合わせフォームプラグインは、お問い合わせページでのみCSSとJSを読み込むべきです。

ただし、一部のプラグインは、そのプラグインの機能がそのページに存在しない場合でも、サイトのあらゆるページでアセットを読み込むようにコーディングされています。

これらの追加ファイルはそれぞれ、総ページサイズと、訪問者のブラウザがページを読み込むために行う必要がある個別のリクエストの数に加算されます。これにより、ウェブサイトが訪問者に対して完全に表示されるまでの時間が直接増加します。

これを念頭に置くと、コードが適切に記述されたプラグインを慎重に選択し、不要なプラグインを避けることが、ウェブサイトの速度を良好に維持するために重要であることがわかります。

プラグインが多すぎるとWordPressは遅くなるか?

プラグインはいくつまで多すぎますか?多くのWordPressユーザーは、プラグインをインストールしすぎるとウェブサイトが遅くなるのではないかと疑問に思っています。

私たちは、主な問題はプラグインの量ではなく、むしろ質であると信じています。

コードが適切に記述されたプラグインは、読み込むファイルを最小限に抑えようとします。このように、問題なく動作する多数の優れたWordPressプラグインをウェブサイトで実行できます。

ただし、すべてのプラグイン開発者がそれほど注意深いわけではありません。一部のプラグインは、必要ない場合でも、すべてのページ読み込み時にファイルを読み込みます。このようなプラグインが多すぎると、ウェブサイトの速度が低下します。

これは、実際の課題は高速なプラグインを選択し、コードの悪いものを避けることであることを意味します。

この問題に関するさらなる議論については、WordPressプラグインをいくつインストールすべきかに関するガイドを参照してください。

プロのヒント: WPCodeは強力なWordPress用コードスニペット管理プラグインで、これを使用することでプラグインの数を減らすことができます。これにより、少なくとも5つのプラグインが不要になります。

非アクティブなプラグインはWordPressを遅くしますか?

WordPressでは、プラグインを非アクティブ化することで一時的に無効にできます。これによりプラグインが削除されるわけではないため、必要になったときに簡単に再アクティブ化できます。

非アクティブなプラグインがウェブサイトを遅くするかどうか疑問に思っているかもしれません。遅くしません。

WordPress は非アクティブなプラグインを読み込まないため、ウェブサイトのリソースを使用しません。非アクティブなプラグインはデータベースにクエリを実行したり、ファイルにアクセスしたりしません。

ただし、将来的に非アクティブなプラグインを使用する予定がない場合は、削除することをお勧めします。非アクティブなプラグインは引き続きアップデートを求められ、ハッカーがそれらを利用してサイトへのアクセスを試みることがあります。

詳細については、非アクティブなプラグインはWordPressを遅くしますか?削除すべきですか?というガイドをご覧ください。

より高速なプラグインを選択する方法

前述したように、最も重要なことは、コードが適切に記述されたプラグインを選択することです。これらは、レビューが良好で、信頼できる情報源によって推奨されているプラグインです。

まず、最適なWordPressプラグインの選び方に関する詳細ガイドをお読みください。

プラグインの使いやすさとパフォーマンスには特に注意を払う必要があります。以下にいくつかのおすすめを紹介します。

  • WPFormsは、WordPress向けの最も高速で最も初心者フレンドリーなお問い合わせフォームプラグインであり、軽量なコードで知られています。
  • All in One SEOは、ウェブサイトのパフォーマンスを重視した強力なWordPress SEOプラグインです。
  • MonsterInsightsは、WordPress向けの最高のGoogleアナリティクスプラグインであり、gtag.jsをローカルに読み込んでGoogleコアウェブバイタルのスコアを向上させることができます。
  • SeedProdは、WordPressのページビルダーであり、最小限のアセットを読み込んでパフォーマンスを向上させながら、非常に高速なランディングページとテーマを作成します。

これらの推奨事項に加えて、独自の速度テストを実行することもできます。プラグインをインストールする前と後にサイトの速度をテストして、パフォーマンスへの影響を比較するだけです。

WordPressプラグインがサイトの読み込みに影響を与えていることがわかった場合は、ウェブサイトを遅くすることなく同じ機能を提供する、より優れたプラグインを探してください。

プラグインオーガナイザーを使用してプラグインを制御する方法

使用しているプラグインの中には、ウェブサイトのすべてのページで実行する必要のないものもあります。それらが必要な場所にのみ実行するようにすることで、ウェブサイトを高速化できます。

例えば、プラグインがWordPressの管理画面でのみ実行される必要がある場合、ウェブサイトのフロントエンドで読み込まれるべきではありません。

プラグインの作者は、ユーザーがプラグイン機能をどのように使用するかを常に予測できるとは限らないため、必要かどうかに関わらずコードを読み込む場合があります。もしプラグインがJavaScriptやCSSファイルを読み込む場合、ウェブサイトのページ読み込み時間が長くなる可能性があります。

必要のないページでそれらのプラグインを無効にすると、読み込み時間が改善されます。

ここで、Plugin Organizer がお役に立ちます。これは、他のプラグインを次のように制御できるWordPressプラグインです。

  • URLに基づいて特定のプラグインを選択的に有効または無効にできます。
  • これにより、異なるユーザーロールに対してプラグインを有効または無効にすることができます。
  • これにより、投稿タイプに基づいてプラグインを有効または無効にすることができます。
  • プラグインの読み込み順序を変更できます。
  • これは、特定のプラグインを無効にし、必要なときにのみ読み込むことを可能にします。

これらの機能を使用することで、Plugin Organizerはプラグインを制御し、ウェブサイトのパフォーマンスを微調整できます。

詳細な手順については、WordPressサイトを高速化するためにPlugin Organizerを使用する方法に関するガイドをご覧ください。

また、ウェブサイト訪問者の半数以上がスマートフォンやその他のデバイスを使用しているため、これらのユーザーにとってもサイトが迅速に読み込まれるようにする必要があります。

モバイルで特定のプラグインを無効にするには、プラグインオーガナイザーを使用します。方法については、モバイルユーザー向けに特定のWordPressプラグインを無効にする方法に関するガイドを参照してください。

モバイルユーザー向けに特定のプラグインを無効化できるようにするオプションをオンにする

ただし、別のプラグインをインストールせずにWordPressプラグインを制御したい場合は、このガイドの残りの部分でその方法を段階的に説明します。ただし、これはより技術的なユーザーにのみ推奨されます。

WordPressプラグインによって読み込まれるファイルをチェックする方法(上級者向け)

プラグインがページの読み込み時間にどのように影響するかを確認するには、WordPressプラグインによってロードされるファイルを確認する必要があります。幸いなことに、これを把握するために使用できるツールはたくさんあります。

簡単な方法の1つは、ブラウザの開発者ツールを使用することです。Google Chrome または Firefox では、ウェブサイトを右クリックして「検証」を選択するだけです。これにより、開発者ツールパネルが開きます。

「ネットワーク」タブをクリックし、ウェブサイトを再読み込みしてください。ページが再読み込みされると、ブラウザが各ファイルをどのように読み込んでいるかを確認できるようになります。

ブラウザの開発者ツールを使用して読み込まれているファイルを表示する

ロードに時間がかかるファイルに注意してください。「時間」列を見ると、各ファイルがロードされるのにかかった時間がわかります。

もし、JS(JavaScript)やCSSのような、読み込み時間に影響を与える可能性のある特定の種類のファイルだけを見たい場合は、上部にあるボタンを使用してリストをフィルタリングしてください。

より詳細なレポートについては、PingdomGTmetrixのようなサードパーティツールを使用することもできます。これらのツールは、読み込まれるすべてのファイルとその読み込み時間に関するさらに役立つ情報を提供してくれます。

読み込まれるウェブサイトファイルに関するGTmetrixレポート

WordPressプラグインアセットを手動で最適化する方法(上級者向け)

上級のWordPressユーザーは、WordPressプラグインがサイトでファイルをロードする方法を管理しようとすることができます。これにはコーディングに関する知識とデバッグスキルが必要であることを覚えておいてください。

重要なお知らせ: 以下のいずれの方法も、実際のサイトでテストしないことを強くお勧めします。実験に最適な場所は、ローカルのWordPressインストールまたはマネージドWordPressホスティングプロバイダーのステージングサイトです。

WordPressでスクリプトとスタイルシートを正しく読み込む方法は、wp_enqueue_style関数とwp_enqueue_script関数を使用することです。

ほとんどのWordPressプラグイン開発者は、これらの関数を使用してプラグインファイルをロードし、ファイルが必要なときと場所にのみロードされるようにします。WordPressには、これらのスクリプトとスタイルシートを登録解除するための簡単な関数も用意されています。

ただし、これらのスクリプトとスタイルシートの読み込みを単純に無効にすると、プラグインが壊れて正しく機能しなくなります。これを修正するには、これらのスタイルとスクリプトをテーマのスタイルシートとJavaScriptファイルにコピーして貼り付ける必要があります。

この方法で、すべてを一度に読み込むことができ、HTTPリクエストを最小限に抑え、ページの読み込み時間を効果的に短縮できます。

WordPressでスタイルシートとJavaScriptファイルを簡単に登録解除する方法を見てみましょう。

WordPressでプラグインのスタイルシートを無効にする方法(上級者向け)

まず、登録解除したいスタイルシートの名前またはハンドルを見つける必要があります。ブラウザのインスペクトツールを使用して見つけることができます。

スタイル名を見つけるためにインスペクトを使用する

スタイルシートハンドルを見つけたら、WPCode のようなスニペットプラグイン(推奨)を使用してこのコードを追加することで、登録解除できます。スニペットプラグインを使用することをお勧めします。これは、テーマの functions.php ファイルを直接編集するよりもはるかに安全であり、テーマを更新してもコードが消去されないためです。

add_action( 'wp_print_styles', 'my_deregister_styles', 100 );
function my_deregister_styles() {
    wp_deregister_style( 'gdwpm_styles-css' );
}

'gdwpm_styles-css'を無効にしたいスタイルハンドルに変更することを忘れないでください。

このコードスニペットをWPCodeで追加するには、カスタムPHPスニペットを作成し、名前を付けて、コードをコードプレビューペインに貼り付けるだけです。

プラグインのスタイルシートを無効にするWPCodeスニペット

その後、スニペットを「アクティブ」に切り替え、[スニペットの保存]ボタンをクリックしてコードを保存してください。詳細については、WordPressにカスタムコードスニペットを追加する方法に関するガイドを参照してください。

この関数内で、必要なだけ多くのスタイルハンドルを登録解除できます。

例えば、スタイルシートを解除登録する必要があるプラグインが複数ある場合は、次のように行います。

add_action( 'wp_print_styles', 'my_deregister_styles', 100 );
function my_deregister_styles() {
    wp_deregister_style( 'gdwpm_styles-css' );
    wp_deregister_style( 'bfa-font-awesome-css' );
    wp_deregister_style( 'some-other-stylesheet-handle' );
}

これらのスタイルシートの登録を解除すると、ウェブサイトのプラグイン機能に影響があることを忘れないでください。登録解除した各スタイルシートの内容をコピーし、WordPressテーマのスタイルシートに貼り付けるか、カスタムCSSとして追加する必要があります。

これにより、訪問者のブラウザは多くの小さな CSS ファイルの代わりに 1 つの結合された CSS ファイルをダウンロードするだけで済むため、サイトの速度が向上します。サーバーへのリクエスト数が削減されます。

WordPressでプラグインのJavaScriptを手動で無効にする方法(上級者向け)

スタイルシートと同様に、登録解除するには JavaScript ファイルで使用されているハンドルを見つける必要があります。ただし、インスペクトツールを使用してハンドルを見つけることはできません。

JavaScript ファイルの正しいハンドルを見つけるのは難しい場合があります。インスペクトツールでは簡単に見つけられないためです。幸いなことに、すべてのスクリプトハンドルのリストを取得する簡単な方法があります。

このコードをテーマの functions.php ファイルまたは新しい WPCode スニペットに追加できます。

function wpb_display_pluginhandles() {
$wp_scripts = wp_scripts();
$handlename .= "<ul>";
    foreach( $wp_scripts->queue as $handle ) :
      $handlename .=  '<li>' . $handle .'</li>';
    endforeach;
$handlename .= "</ul>";
return $handlename;
}
add_shortcode( 'pluginhandles', 'wpb_display_pluginhandles');

このコードを追加した後、[pluginhandles] ショートコードを使用してプラグインのスクリプトハンドルのリストを表示できます。

このようになります:

プラグインスクリプトハンドル

スクリプトハンドルを取得したので、以下のコードを使用して簡単に登録解除できます。

コードをテーマの functions.php ファイルまたは、新しいWPCodeスニペットに追加するだけです。これは、スタイルシートを無効にしたときと同じように行います。

add_action( 'wp_print_scripts', 'my_deregister_javascript', 100 );

function my_deregister_javascript() {
    wp_deregister_script( 'contact-form-7' );
}

このコードを使用して、複数のスクリプトを無効にすることもできます。

このようになります:

add_action( 'wp_print_scripts', 'my_deregister_javascript', 100 );

function my_deregister_javascript() {
    wp_deregister_script( 'contact-form-7' );
    wp_deregister_script( 'gdwpm_lightbox-script' );
    wp_deregister_script( 'another-plugin-script' );
}

前述したように、これらのスクリプトを無効にすると、プラグインが正しく機能しなくなります。これを修正するには、各プラグインから JavaScript をコピーして、テーマのメイン JavaScript ファイルに貼り付ける必要があります。

しかし、この高度な手順は複雑で、異なるスクリプトが互いに競合する可能性があるため、問題を引き起こす可能性があります。ステージングサイトで慎重なテストが必要です。

特定のページでのみスクリプトを読み込む方法(上級者向け)

ウェブサイトの特定のページでプラグインスクリプトをロードする必要があることがわかっている場合は、その特定のページでプラグインを許可できます。

これにより、スクリプトはサイトの他のすべてのページで無効なままになり、必要な場合にのみ読み込まれます。

特定のページでスクリプトを読み込む方法は次のとおりです。

add_action( 'wp_print_scripts', 'my_deregister_javascript', 100 );

function my_deregister_javascript() {
    if ( !is_page('Contact') ) {
        wp_deregister_script( 'contact-form-7' );
    }
}

このコードは、お問い合わせフォームのページ以外ではすべてcontact-form-7スクリプトを無効にします。使用したいページ名とプラグインスクリプトハンドルをそれぞれ変更するだけです。

WordPressプラグインとサイトの速度に関するよくある質問

WordPressプラグインがウェブサイトのパフォーマンスにどのように影響するかについて、よく受ける質問への回答を以下に示します。

1. サイトを遅くするのはプラグインの数ですか、それとも質ですか?

質は量よりもはるかに重要です。ウェブサイトは、コードが適切に記述された多数のプラグインを、目立った遅延なしに実行できます。しかし、コードが不適切に記述されたプラグインが1つあるだけで、データベースへのリクエストが多すぎたり、すべてのページに不要なスクリプトを読み込んだりすることで、パフォーマンスに大きな影響を与える可能性があります。

2. 非アクティブなプラグインはWordPressサイトを遅くしますか?

いいえ、非アクティブなプラグインはサイトの読み込み時間に影響しません。WordPressはアクティブなプラグインのファイルのみを読み込むため、サーバーリソースを使用しません。ただし、再度使用する予定のないプラグインは削除することが、セキュリティ上の良い習慣です。

3. どの特定のプラグインがウェブサイトを遅くしているかを知るにはどうすればよいですか?

最も信頼性の高い方法は、まずサイトの速度をテストすることです。次に、すべてのプラグインを非アクティブ化し、再度テストします。各テストのたびに速度テストを実行しながら、1つずつ再アクティブ化できます。速度が大幅に低下した場合は、問題の原因となっているプラグインが見つかったことになります。

多くの機能を備えた1つの大きなプラグインと、いくつかの小さな単一目的のプラグインのどちらが良いですか?

コードの質に完全に依存します。多くの場合、軽量で専門的な複数のプラグインは、使用していない機能のアセットを読み込む、肥大化した多目的プラグインよりも効率的です。常に、高速で効率的であることが知られているプラグインを選択してください。

ウェブサイトを高速化するための追加リソース

パフォーマンス向上のためにプラグインを管理する方法がわかったので、サイトをさらに高速化するための他の方法を検討できます。次のステップとして、これらのガイドをお勧めします。

この記事が気に入ったら、WordPressのビデオチュートリアルについては、YouTubeチャンネルを購読してください。 TwitterFacebookでもフォローできます。

開示:当社のコンテンツは読者によってサポートされています。これは、当社のリンクの一部をクリックすると、当社が手数料を得る可能性があることを意味します。WPBeginnerがどのように資金提供されているか、それがなぜ重要か、そしてどのように私たちをサポートできるかについては、こちらをご覧ください。当社の編集プロセスはこちらです。

究極のWordPressツールキット

無料のツールキットにアクセスしましょう - すべてのプロフェッショナルが持つべきWordPress関連の製品とリソースのコレクションです!

読者とのインタラクション

16 CommentsLeave a Reply

  1. プラグインをより速く選ぶという話は、本当に心に響きました。
    私は、実際に役立っていることを始めています。それは、新しいプラグインはすべて、公開する前にまずステージングサイトでテストすることです。クライアントのウェブサイトで、多くの頭痛の種を回避することができました!よくできているプラグインと、ただ寄せ集められただけのプラグインとの違いを見るのは驚くべきことです。
    量より質という点には完全に同意します。数少ない、よりよくコード化されたプラグインを持つ方が、平凡なものをたくさんロードするよりも効果的であることが多いと学びました。たとえ20個のしっかりしたプラグインが必要でも、それらはすべてを遅くするような出来の悪い5個のものよりも、おそらくうまく動作するでしょう。

  2. プラグインが多すぎることに関する質問に回答したいと思います。このウェブサイトは、プラグインの数に関してついに私の目を開かせてくれました。私は常に、20個のプラグイン以内に収めなければならない、そうでなければ遅くなるという仮定のもとでWordPressを扱っていました。時々、私はこれに非常に苦労し、この制限に収まるようにどのプラグインを選択するかを再評価しました。あなたの推奨により、量ではなく質であることがわかったとき、私はこのドグマを捨てました。今日、私のウェブサイトには38個のプラグイン(そのうち半分は有料)がありますが、ウェブサイトは依然として高速であり、PHP制限を超えることはありません。この件に関するあなたの教育は、プラグインの選択と一般的な作業に大いに役立ちました。

  3. 要するに、大きな違いを生むのはプラグインの数ではなく、コードが不十分なプラグインの数であり、それがタスクを困難にし、ウェブサイトに問題を引き起こします。
    私の意見では、プラグインを選択する際に考慮すべきことは、タスク固有のプラグインのみをインストールすることです。
    簡単なタスクを実行するためにすべてをロードするものではありません。
    ガイドをありがとうございます。

  4. すべてを理解できたか確信がありません。Contact Form 7 に最後のコードスニペット(特定のページでのみスクリプトを読み込む)を使用したいです。

    私にとって不明なのは4行目です。「Contact」は、お問い合わせフォームがあるページのタイトルを指しますか?私のページのタイトルが「Contact Us」の場合、4行目のこれを変更する必要がありますか?

    事前に感謝いたします。敬具、

  5. 本当に素晴らしいヒントです!

    プラグインのスタイルシートとスクリプトをそれぞれ単一のスタイルシートファイルと単一のスクリプトファイルに登録解除してマージすることに関する質問ですが、プラグインのアップデートがあるたびにこれを行う必要がありますか?もしそうなら、これを回避する方法はありますか?

  6. コピーを書く際にいくつかのプラグインを使用しています。(フォントなど)使用していないときに無効にすると効果がありますか?

  7. 皆さん、こんにちは。

    CSSのみのCode Penをページに追加するにはどうすればよいですか?また、JSを含むペンはどうすれば追加できますか?

    ありがとうございます!

    PeTe

  8. これは初心者と上級者の両方にとって非常に役立つ投稿です。また、CSSをレンダリングをブロックせずに使用して、サイトやプラグインを高速化することもできます。

    • また、プラグインの一部の言語を削除することもできます。したがって、.po および .mo ファイル(使用できない場合)を削除すると、より高速にロードできます。ヘルプファイルや画像も削除でき、JS および CSS を最小化できます(必須ではありません)。その他にもいくつかあります…

  9. このウェブサイトのリンクは
    AJAXの読み込みを停止したいのですが、やり方がわかりません。誰か助けてくれませんか?
    本当に感謝します。
    ありがとう

  10. WPのトップソーシャルメディア共有ボタンのリストを作成していただけますか?
    例えば、ご自身のウェブサイトで共有ボタンのために何を使用していますか?プラグイン、Shareaholic、SumoMeなどですか?それとも自作のものですか?

返信する

コメントを残していただきありがとうございます。すべてのコメントは、当社のコメントポリシーに従ってモデレーションされますので、ご了承ください。メールアドレスは公開されません。名前フィールドにキーワードを使用しないでください。個人的で有意義な会話をしましょう。