福岡散歩ブログ

ページ高速化プラグイン「lazy load」の罠【備忘録】

本日のおすすめ記事

【75点】微かな物音で殺される「ザ・サイレンス 闇のハンター」評価と感想【Netflix】

Netflixオリジナル作品「ザ・サイレンス 闇のハンター」を鑑賞しました。 いつも通りネタバレ無し情報を書いた後にネタバレしていきます。...

この記事はたぶん 1 分で読めます。
ぱっかん
執筆者:ヘタレブロガーのぱっかん(@pakkan316

画像を遅延読み込みする「lazy load」というプラグインがあります。

これを使う事で、「まだディスプレイに表示されてないスクロール領域外の画像」は一旦読み込まれなくなる為、ページ表示初期段階での読み込み完了が速くなります

最近「PageSpeed Insights」でのスコア判定が厳しくなったこともあり、改めて「lazy load」を導入してみました。(以前導入を断念した理由を忘れていた)

しかしやっぱりダメで、というのも「目次」機能とバッティングしちゃうんです。
いわゆる「ページ内リンク」ですね。

ページ内リンクは、「idが振られたコンテンツまでスクロールする」という仕組み。
「lazy load」を導入すると、画像のほとんどが表示されていない状態なので、「画像分の高さ」が加算されず、その結果ページ内リンクのスクロール距離が足りなかったりします。

実際に僕のブログでは、そんな感じで「目次からの見出しジャンプ」が上手く機能しなくなりました

僕と同じように「Google Speed Testですこぶる低評価だったからとりあえずブログを高速化をしたい」と思って「lazy load」に辿り着く人も多いと思いますが、とりあえず「目次機能」を使ってる人は挙動チェックを定期的にした方が良いと思われます。

ワードプレスで「lazy load」を導入したい方は、こちらが参考になります。
高速化プラグイン『Lazy Load』の使い方&初期設定は? | ひつじアフィリエイト




Trash Area(筆者のバンド)のオリジナル曲

本日のおすすめ記事

【75点】微かな物音で殺される「ザ・サイレンス 闇のハンター」評価と感想【Netflix】

Netflixオリジナル作品「ザ・サイレンス 闇のハンター」を鑑賞しました。 いつも通りネタバレ無し情報を書いた後にネタバレしていきます。...

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

この記事をこねた人

名前:ぱっかん
日常のクッソどうでもいいことが、鬼のように幸せに感じられる性格をしています。

なので思い切って「人生は映画だ」というテーマでブログを始めました(厳密には途中でそういうテーマに切り替えました)。
些細な毎日がどれだけ素晴らしいかを、いわゆる「引き寄せ系アラフォーブロガー」等とは違う路線で伝えられたらと思ってます。

「内省」という資質に優れており、それを活かした映画系の記事が得意。
→「当ブログ」と「ぱっかん」について

【職業】web諸々
【趣味】考えをまとめる・散歩・映画
【好きなファッション】ウォーキングデッドに出てきそうな奴
【好きな食べ物】ネオソフト・きなこご飯
【ストレングスファインダーの結果】着想/最上志向/内省/共感性/運命思考