How to get width and height attributes on img element using Next/Image

Viewed 850

The image is working just fine. Here is the code

<Image
  layout="fixed"
  src="/images/example.jpeg"
  alt="Example image"
  width="140"
  height="140"
 />

But, when I run the website on web.dev, I don't get a topscore in Performance. The main reason is Image elements do not have explicit width and height

I've studied this, and can tell from here https://web.dev/optimize-cls/?utm_source=lighthouse&utm_medium=lr#images-without-dimensions That width and height attributes is needed, which don't appear, using next/image

How do I solve this?

1 Answers

I am facing the same issue - changing layout to responsive did not solve the problem. It rather looks like the component is missing the rendering of the supporting tags - it should actually be implemented as described in the initial lighthouse link.

Related