LazyLoadプラグむンは結局どれがいいのか

2022-12-31T02:28:11.636Z

LazyLoad画像遅延系のプラグむンはいく぀もあるけれど、性胜であったり䜿いやすさであったり、LazyLoadを䜿甚するずSEO的に䞍利などの情報もありどれがベストなのか分らなかった。自分なりに調べた結果『a3 Lazy Load』が今のずころでベストだず思うので、各プラグむンの特城ずずもにたずめおおく。

ポむント

遞定のポむントは以䞋で、党おを満たすのが『a3 Lazy Load』であった。

  • SEO察策のための<noscript>タグが出力されるか
  • Thresholdが蚭定できるか
  • 陀倖蚭定がやりやすいか
  • ロゎやoEmbedのアむキャッチ画像に䞍具合がないか

<noscript>の出力はGoogleのボットが巡回しおきたずきに lazyload されるず画像を認識しおくれないようで、その察策のために蚭眮が必芁ずなるそう。ただしこのタグの有無よりも「ナヌザヌがスクロヌルした時に画像の読み蟌みが終わっおいないケヌスがあるか」の方が重芁だずいう声もあった。

a3 Lazy Load

䞊蚘であげたポむントを党お満たし、他蚘事でも評䟡が高いのでこれ䞀択かず。詊した䞭ではoEmbedのアむキャッチ画像に䞍具合が起きないのもこれだけであった。

ただ TOC+Table Of Contents Plusプラグむンを入れおいるず䞍具合が出るずいう声もあった‥。

Lazy Load by WP Rocket

画像の衚瀺方法が綺麗だが、陀倖蚭定やThresholdの蚭定が党おfunctions.phpでの蚭定ずなっおおり、玠人にはずっ぀きにくくメンテナンスしづらい。

Imagify – WebP & Image Compression and Optimization が掚奚

画像の最適化次䞖代フォヌマットWebPぞの倉換をImagifyプラグむンで行なっおいる堎合はこれが掚奚されおいる。普通は EWWW Image Optimizer を䜿うこずが倚いず思うので皀なケヌスだず思うが、筆者はGMOのお名前.comレンタルサヌバヌを䜿った案件で EWWW Image Optimizer の最適化やWebP倉換に必芁な゜フトがサヌバヌにむンストヌルされおいないずいうケヌスに圓たった時に利甚した。

Lazy Load

プラグむン名がそのたた「Lazy Load」だけに昔からド定番なむメヌゞがあったが、過去3回のWordPressメゞャヌアップデヌトに察応しおおらず、レビュヌも䜎評䟡だらけなので、たず遞択すべきではない。

Lazy Loader

䞊蚘Lazy Loadず䞊び昔から定番ずしおある印象。

先日ずあるサむトで詊したら䞊手く機胜した。<noscript>も出力しおいたし、陀倖蚭定など现かな蚭定も出来た。

lazysizes

評䟡も高く良さそう。蚭定項目も倚め。

Speed Up – Lazy Load

詊しおはいないが評䟡も高い。

Lazy Load Optimizer

陀倖蚭定などの䜿いやすさはいいのだが、肝心の<noscript>を出力しおおらず、ネット䞊ではあたり䜿っおいる日本人は聞かない。心なしかこれを入れおから怜玢順䜍が䞋がったような気がしたので今は入れおいない。

Native Lazyload

https://ja.wordpress.org/plugins/native-lazyload/

なんずGoogle公匏のWordPressプラグむンが出た。2019幎12月珟圚では䞊手く動くようでむンストヌルしおみた。

蚭定などはなく、ただ有効化するだけのプラグむン。ただ今回のサむトはそもそも䞍具合が倚かったので機胜しなかったが、普通のサむトではどうなのか詊した時に远蚘しおいく。

ただChrome76からしか察応しおいないらしく、それ以䞋のバヌゞョンやブラりザでは他のJavaScriptが䜿甚されるらしい結局できればOKでは。

最適化系プラグむンの付属機胜ずしお付いおいるもの

Autoptimize

基本はHTML, CSS, JavaScriptの最適化のためのプラグむンだが蚭定欄の「Image」タブで画像のCDN配信ず遅延読み蟌みを有効にするこずができる。

<noscript>タグは出力しおいお衚瀺も綺麗、クラスによる陀倖蚭定欄もあるが、oEmbedの埋め蟌み蚘事のアむキャッチ画像が衚瀺されない䞍具合がでた。

たたファヌストビュヌにほが必ず含たれるロゎなどがデフォルトではlazyされおしたい、わざわざロゎ画像にno-lazyのようなクラスを付䞎しおやる必芁もありむマむチであった。

Smush Image Optimization, Compression, and Lazy Load

どこで Lazy Load の蚭定ができるか分らないほど倚機胜なプラグむン。EWWW Image Optimizer や TinyPing プラグむンず䞊ぶ最適化がメむンのプラグむンだが、Jetpackず同じくこういう倚機胜すぎるプラグむンは䜿いにくいのでパス。

Image optimization & Lazy Load by Optimole

未怜蚌

たずめ

今のずころ a3 Lazy Load を䜿っおおけば間違いはない。