loading=”lazy”が使えるのはimgタグとiframeタグ、videoタグには使えない

Youtubeの動画のURLをWordPressの投稿画面に貼り付けると下のような感じで自動的に動画の埋め込みに変換してくれる

これは、URLをこんな感じのhtmlに自動的に変換してくれているから

WordPressには標準機能でimgタグやiframeタグにloading=”lazy”を追加してくれるので、自分で書かなくてもOK

loazyloadというのは動画がページの表示範囲に入ってくるまでは動画を読み込みしないための設定

たとえば、1つの記事に100個のYoutube動画を貼り付けたとして、100個の動画を一斉に読み込むとページの表示速度がめちゃめちゃ遅くなる

最初は動画を読み込まないようにしておいて、ユーザーが動画の位置までページをスクロールしたときにようやく動画の読み込みを始める、それがlazyload

videoタグの場合

loading=”lazy”代わりにpreloadというのがある

preload=”none”を設定してやると動画を読み込まない
(ユーザーが再生ボタンを押したときに動画の読み込みを開始)
という設定になるので、lazyloadに近い働きをする

このページは移転しました。