①loading属性は、ブラウザが画像を直ちにロードするか、ユーザーが画像の近くまでスクロールするまでスクリーン外の画像のロードを延期するように指定します。
eagerはデフォルトの動作で、lazyはロードを遅延させるために使用します。
②「画像をいつ読み込むか？」という画像の読み込みのタイミングを指定する。loading属性に「lazy」を指定することで、ページ下部にある画像は最初の時点では読み込まず、その画像の表示領域の近くまでスクロールされたタイミングで画像を読み込むという、遅延読み込みを行うことができる。デフォルトは「eager（すぐに読み込む）」。
loading属性を指定する場合は、width属性とheight属性も併せて指定することが必須となっている（レイアウトシフト対策にもなるので必ず付けること）。
なお、lazyはiframe要素にも使用できる。
<img src="images/coffee.jpg" width="480" height="320" alt="厳選した…" loading="lazy">