福岡散歩ブログ

カテゴリー

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

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

本日のおすすめ記事

【60点】ロボットに育てられた、たった一人の少女「アイ・アム・マザー」評価と感想【Netflix】

ロボットに育てられ1人で大人になった少女。 ロボットの目的は何??NetflixオリジナルのSF作品「アイ・アム・マザー」を鑑賞し...

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

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

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

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

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

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

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

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

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




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

コメントを残す

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

この記事をこねた人

名前:ぱっかん
web系の会社で働きつつ、副業(趣味)でメディア運営をやっています。

運営してるメディア
ぱっかんブログ(当サイト)
やるゲーブログ
福岡散歩ブログ

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

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