Slide 28
Slide 28 text
Copyright © ONE CAREER Inc. All Rights Reserved.
> You should use the priority property on any image detected as the Largest Contentful
Paint (LCP) element. It may be appropriate to have multiple priority images,
as different images may be the LCP element for different viewport sizes.
引用元:https://nextjs.org/docs/pages/api-reference/components/image#priority
LCP 課題の改善方法:遅延読み込みの解除
改善方法
28
Next/Image はデフォルトで画像の遅延読み込みを行う
☞ priority オプションを trueにすることで preloadを行う
Next.jsの公式ドキュメントにも「LCPに該当する画像ならtrueにしようね!」という記述が存在