WordPressサイトを高速化するための最高の遅延読み込みプラグイン

大量の画像があるサイトは、読み込みに永遠にかかる可能性があります。 すべての画像について、これは別のHTTPリクエストであり、ページの読み込みが遅い間、ユーザーはフラストレーションを感じて待つ必要があります。

それで、解決策は何ですか？ 遅延読み込み。

読み続けるか、次のリンクを使用して先に進んでください。

• WordPress5.5で到着したネイティブ遅延読み込み
• プラグインはもう必要ですか？
  • インターフェイスへのアクセス
  • ブラウザの互換性
  • 追加の最適化
• ネイティブ遅延読み込みには何か利点がありますか？
• 最高の遅延読み込みプラグイン
• 遅延読み込みの詳細

遅延読み込みを使用すると、画像の多いサイトを大幅に高速化でき、サイトで有効にするのにまったく時間がかかりません。

簡単に言うと、画像が「スクロールしなければ見えない位置」にある場合にのみ画像が読み込まれます。つまり、ユーザーのブラウザに表示された画像のみが読み込まれます。

したがって、10個の新鮮で無料のフルスクリーンWordPressテーマを備えたページがある場合、投稿の最初の数枚の画像のみが読み込まれ、ユーザーがページを下にスクロールすると他の画像が読み込まれます。

WordPress5.5で到着したネイティブ遅延読み込み

遅延読み込みは、WordPressの比較的新しい機能です。

これは、「lazy」の属性を追加し、値を「loading」に設定することで機能します。この値は、出力時にブラウザーによって処理されます。

忠実な遅延読み込みプラグインがある場合、または遅延読み込みをまったく有効にしたくないフェーズを通過している場合は、無効にできると聞いて喜ぶでしょう。

一部のプラグインはこれを自動的に実行しますが、手動で実行する必要がある場合は、functions.phpファイルに移動して以下を追加するだけです。

add_filter( 'wp_lazy_loading_enabled', '__return_false' );

これにより、WordPressの遅延読み込み機能が無効になります。つまり、競合のリスクなしに、選択したプラグインを使用できるようになります。

たった1行のコードですが、追加することに抵抗がある場合は、この簡単なプラグインをダウンロードしてください。

プラグインはもう必要ですか？

WordPressがネイティブの遅延読み込みを提供するようになった今、プラグインを使用するかどうか疑問に思われるかもしれません。

プラグインを使い続ける理由はいくつかあるので、よく読んでください。

インターフェイスへのアクセス

Smushなどの優れた遅延読み込みプラグインは、特定の設定を微調整するオプションを備えたインターフェイスと、ボタンに触れるだけで遅延読み込みのオンとオフを切り替える機能を提供します。

これらのオプションは、遅延読み込みされる画像の種類から、遅延読み込みが適用されるページまでさまざまです。 プラグインなしでこのような設定を変更したい場合は、コードを深く掘り下げて、これらの例外を手動で追加する必要があります。

ブラウザの互換性

もう1つの大きな利点は、ほとんどのプラグインがすべてのブラウザーで機能することです。 Safariはloading属性をサポートしていないメインのブラウザの1つであるため、画像がたくさんあるWebサイトがある場合、サポートされていないブラウザのユーザーがバウンスするのを見ることができます。 これは、プラグインを使用するときに心配する必要がないものです。

追加の最適化

ほとんどのプラグインは、遅延読み込み以上のものを提供します。 あなたのウェブサイトに画像最適化プラグインを導入することは、おそらくあなたがこれまでに行う最良の決定の1つです。

Smushなどのプラグインは、Googleの画像関連のPageSpeedの推奨事項に対応し、サイトの速度を向上させるのに役立ちます。遅延読み込みはほんの始まりに過ぎません。

ネイティブ遅延読み込みには何か利点がありますか？

一見すると、プラグインはネイティブの遅延読み込みで実行できるすべてのことを実行するように見えるかもしれません。

これは技術的には正しいですが、主な違いは、ほとんどのプラグインには、サイトが依存するJavaScriptライブラリの導入が含まれることです。

ネイティブの遅延読み込みはよりシンプルでわかりやすく、余分なコードはそれほど必要ありません。

画像最適化プラグインであるSmushは、実際には独自のバージョンのネイティブ遅延読み込みを提供します。

WordPressと同じように機能しますが、Smushと同じ画像形式をすべてサポートします。

ネイティブの遅延読み込みは、おそらく将来の他の開発の基盤として使用できるものですが、少なくとも今のところ、プラグインはほとんどのサイトに最適です。

遅延読み込みのニーズを解決するためのプラグインのアイデアを好む場合は、無料の遅延読み込みプラグインのコレクションをまとめました。

• スマッシュ画像の最適化

  

  Smushは、理由から最も人気のあるオールインワンの画像最適化プラグインです。 画像の読み込みを高速化するために必要なものがすべて含まれています。

  遅延読み込みは、無料バージョンのSmushとターボチャージされたSmush Proの両方で利用できます。これは、Smush Pro CDNに付属しており、ネイティブの遅延読み込みとは異なり、すべてのブラウザーと互換性があります。

  Smushで遅延読み込みをアクティブにするために、プロセスを非常にシンプルにしました。 SmushのLazyLoadingセクションに移動し、 Activateボタンを押すだけです。 それでおしまい。

  遅延読み込みがアクティブになったら、設定をさらに調整できますが、必須ではありません。 SmushとSmushProのデフォルト設定は、パフォーマンスの大幅な向上を確認するために必要なすべてです。

• a3遅延ロード

  

  A3 Lazy loadは、サイト上の画像、iframe、動画、その他の要素を遅延読み込みするための人気のあるプラグインです。

  たくさんの設定があるので、サイトのアセットをどのようにロードするかをカスタマイズできます。

  また、WooCommerce、Advanced Custom Fields、さまざまなCDNなどの一般的なプラグインと100％互換性があることもテストされています。

• クレイジーレイジー

  

  これが、機能するもう1つの超無駄のない遅延読み込みプラグインです。 複雑な設定は必要ありません。

  テーマまたはjQueryの使用法に応じて、CrazyLazyはオプションでjQueryプラグインUnveil.jsまたはネイティブJavaScriptライブラリlazyload.jsの変更バージョンを利用します。

• 動画の遅延読み込み

  

  すべての遅延読み込みプラグインがビデオで機能するわけではありません。これは、ビデオが画像よりもWebページのファイルサイズに大きな影響を与える可能性があるため、残念です。

  動画の遅延読み込みは、VimeoまたはYouTubeでホストされている動画の遅延読み込みに役立ちます。 プレースホルダー画像を読み込み、訪問者がクリックした場合にのみ動画と動画プレーヤー全体を読み込みます。

  これは、サイトに多数の動画があり、動画の遅延読み込みを含まない軽量プラグインを選択する場合に不可欠です。

遅延読み込みの詳細

プラグインを使用するのがサイトに遅延読み込みを追加する最も簡単な方法ですが、それが唯一の方法ではありません。 よりスリムなソリューションが必要な場合は、サイトでJavaScriptを使用することもできます。

詳細については、遅延読み込みがどのように機能するか、およびサイトでテクニックを再現する方法の完全な内訳について、WordPressで遅延読み込みを使用してオフスクリーン画像を延期する方法を確認してください。

WordPress独自の遅延読み込み機能について詳しく知りたい場合は、お知らせをご覧ください。

遅延読み込みを開始する最も簡単な方法は、SmushfreeまたはSmushProを使用することです。

Smush Proは、他のGooglePageSpeedInsightsの機会に役立つ他の機能を追加します。 画像をWebPファイルに変換することで次世代フォーマットの画像を提供し、SmushProCDNで画像をスケーリングすることで画像のサイズを適切に設定するのに役立ちます。 SmushProは人気のあるWPRetina2xプラグインとも互換性があるため、WordPressの速度を落とすことなく、これらの巨大なRetina画像を遅延ロードできます。

Smush Proを無料で試して、サイトにどれだけの違いが生じるかを確認してください。

• 画像