Lazy Loader
Lazy Loader – Felix Arntz(flixos90)
Lazy Loaderは、WordPress標準のネイティブ遅延読み込み(loading="lazy"属性)を拡張し、画像・iframe・動画をきめ細かく制御できる軽量プラグインです。WordPressはバージョン5.5から画像へのloading="lazy"自動付与に対応しましたが、iframeや動画、特定ページでの除外には対応していません。Lazy Loaderはこのギャップを埋める補完プラグインとして開発されており、JavaScriptに依存しないネイティブ実装のためパフォーマンスへの悪影響が最小限です。開発者はGoogleのChrome・WordPress担当エンジニアであるFelix Arntz氏です。
基本情報
| プラグイン名 | Lazy Loader |
|---|---|
| 開発・提供 | Felix Arntz(flixos90)/ Googleエンジニア |
| 料金 | 完全無料(有料版なし) |
| 対応WordPress | 5.7 以上(推奨:最新版) |
| 対応PHP | 7.0 以上 |
| 日本語対応 | 対応 |
| インストール数 | 2万以上(WordPress.org 公式) |
| 評価 | 4.5(60件以上のレビュー) |
| WordPress.org | wordpress.org/plugins/lazy-loader/ |
loading="lazy"を自動付与しますが、iframeへの適用・特定投稿での無効化・動画への対応は標準機能では行えません。Lazy Loaderはこれらを追加するための補完プラグインです。すでにWordPress標準のLazy Loadが効いているサイトでは、追加でLazy Loaderを入れるかどうかは用途によって判断してください。
ネイティブLazy Loadとは?
遅延読み込み(Lazy Load)とは、ページを開いた瞬間にすべての画像を読み込まず、ユーザーがスクロールして画像が画面内に入るタイミングで初めて読み込む技術です。ファーストビュー外の画像の読み込みを後回しにすることで、初期表示に必要なデータ量を大幅に削減し、LCP(最大コンテンツ描画)の改善に貢献します。
かつてはJavaScriptライブラリ(jQuery Lazyload等)で実装されていましたが、現在はブラウザが直接対応するネイティブLazy Load(loading="lazy"属性)が主流です。Chrome・Edge・Firefox・Safari(iOS 15以降)など主要ブラウザでほぼ全対応しています。
主要機能
画像への loading="lazy" 拡張
WordPress標準が対応していないケース(テーマ独自の出力など)にもloading="lazy"を付与。標準機能を補完する形で動作する。
iframeへの対応
YouTube・Vimeo・Google マップなどiframeで埋め込まれたコンテンツにも遅延読み込みを適用。iframeは特に読み込みが重いため効果が大きい。
動画(video要素)への対応
HTMLの<video>タグで埋め込んだ動画ファイルにも遅延読み込みを適用。動画コンテンツの多いサイトでの初期読み込み削減に役立つ。
特定ページでの無効化
特定の投稿・固定ページ・カスタム投稿ではLazy Loadを無効化できる。ギャラリーページや画像を即時表示したいランディングページなどに有用。
除外クラスの指定
特定のCSSクラスを持つ画像・iframeをLazy Loadから除外できる。ファーストビューのメインビジュアルやロゴ画像など、即時表示が必要な要素を明示的に除外。
noscript フォールバック
JavaScriptが無効な環境でも画像が正しく表示されるよう<noscript>タグを自動追加する(設定で切り替え可)。アクセシビリティへの配慮が行き届いた設計。
設定画面(メディア設定に統合)
設定は「設定 → メディア」内の「Lazy Loaderオプション」として追加される。独立したメニューを作らないシンプルな設計で管理画面が複雑にならない。
超軽量・JS不使用
ネイティブ実装ベースのため追加のJavaScriptファイルを読み込まない。プラグイン自体のパフォーマンスへの影響を最小化した設計。
インストール・設定方法
Lazy Loaderは有効化するだけで基本的な遅延読み込みが始まります。必要に応じて設定画面で詳細を調整します。
インストールと有効化
-
プラグインのインストールWordPress管理画面 →「プラグイン」→「新規プラグインを追加」から「Lazy Loader」を検索し、「今すぐインストール」→「有効化」をクリック。
-
設定画面を確認する管理画面「設定」→「メディア」を開くと、ページ下部に「Lazy Loaderオプション」が追加されている。デフォルトで画像へのLazy Loadは有効になっている。
-
iframeへの適用を設定(必要に応じて)YouTubeやGoogle マップなどiframe埋め込みにも適用したい場合は「iframeに適用」にチェックを入れる。埋め込みコンテンツが重いサイトでは効果が大きい。
-
除外クラス・除外ページを設定(必要に応じて)ファーストビューのメインビジュアルやLCPの対象となる画像をLazy Loadから除外したい場合は「除外するCSSクラス」に該当クラス名を入力する。特定投稿を除外する場合は投稿編集画面のメタボックスから設定できる。
-
設定を保存して動作確認「変更を保存」をクリックして設定を反映。Chromeの開発者ツール(ネットワークタブ)でスクロールに合わせて画像が順番に読み込まれることを確認する。
LCPに影響する画像の除外方法
loading="lazy"を適用するとLCPスコアが悪化します。除外クラスの設定やテーマのfetchpriority="high"指定を使い、LCP対象画像はLazy Loadから必ず除外してください。
他のLazy Load手段との比較
| 方法・プラグイン | 対応要素 | JS不要 | 除外制御 | 備考 |
|---|---|---|---|---|
| Lazy Loader(本プラグイン) | 画像・iframe・動画 | クラス・ページ | ネイティブ拡張・軽量 | |
| WordPress 標準(5.5以降) | 画像のみ | △ 限定的 | 追加設定なし | |
| EWWW Image Optimizer | 画像 | 画像最適化とセット | ||
| WP Rocket | 画像・iframe・動画 | 有料・総合高速化 | ||
| WP Fastest Cache | 画像 | △ | キャッシュとセット |
こんな人におすすめ
こんな人におすすめ
- YouTube・Google マップなどiframe埋め込みが多いサイト
- WordPress標準のLazy Load機能を補完・拡張したい
- 軽量なプラグインでLazy Load制御を追加したい
- 特定のページや画像だけLazy Loadを無効にしたい
- JavaScriptへの依存を最小限にしたい技術志向のサイト運営者
- Core Web Vitals改善に取り組んでいる
向かないケース
- WP Rocketを使用中(WP Rocketに同機能が内蔵)
- EWWW IOの遅延読み込みを有効化済み(重複)
- 画像圧縮・WebP変換は別途プラグインが必要
- インストール数・実績の多いプラグインを求める場合(2万件は小規模)
よくある質問(FAQ)
-
WordPress 5.5以降は標準でLazy Loadに対応しているのでは?
はい、WordPress 5.5以降は画像に
loading="lazy"属性を自動付与する機能が標準搭載されています。しかし標準機能ではiframeや動画には対応しておらず、特定ページの除外やnoscript対応など細かい制御もできません。Lazy Loaderはこれらの拡張・補完を目的としたプラグインです。 -
ファーストビューの画像にもLazy Loadが適用されてLCPが悪化しませんか?
WordPress標準の
loading="lazy"実装ではファーストビュー内の画像には自動的に適用されない仕組みになっています。ただし設定・テーマによっては誤って適用されるケースがあります。Lazy Loaderでは除外クラスの指定が可能で、ファーストビューのアイキャッチ画像などをLazy Loadから除外できます。LCPスコアに影響する画像は必ず除外設定を行ってください。 -
JavaScriptを無効にしているユーザーへの対応は?
Lazy Loaderはloading="lazy"属性による標準的なネイティブ実装を基本とするため、JavaScriptが無効でも画像は正常に表示されます。noscriptタグによるフォールバック追加機能も設定から有効にでき、アクセシビリティへの配慮も可能です。
-
WP Rocketのような他のプラグインが遅延読み込みを設定している場合、競合しますか?
WP Rocketや一部のキャッシュプラグインも遅延読み込み機能を内蔵しています。同じ機能が重複すると二重適用になる場合があります。WP Rocketを使用している場合はWP Rocketの遅延読み込みを使い、Lazy Loaderは不要なケースが多いです。使用前に既存プラグインの設定を確認してください。
-
YouTubeの埋め込み動画にも遅延読み込みを適用できますか?
はい、YouTubeなどの埋め込みにはiframeが使われているため、Lazy LoaderのiframeへのLazy Load適用を有効にすることで遅延読み込みが機能します。設定画面(設定 → メディア → Lazy Loaderオプション)で「iframeに適用」を有効にしてください。
まとめ
Lazy Loaderは、WordPress標準の遅延読み込み機能を拡張してiframeや動画にも対応させ、除外制御など細かいカスタマイズを可能にする軽量補完プラグインです。GoogleのWordPress担当エンジニアが開発しており、ネイティブ実装ベースで余分なJavaScriptを追加しない設計が特徴です。
「iframeが多いのに遅延読み込みが効いていない」「特定ページだけLazy Loadを無効にしたい」というニーズに的確に応えます。ただしWP RocketやEWWW IOなどすでに遅延読み込みを備えたプラグインを使用中の場合は重複に注意してください。画像最適化カテゴリの他プラグイン(EWWW Image Optimizer・Converter for Media)と組み合わせて使うと、より総合的なサイト高速化が実現できます。