Next.js: next/image should infer image aspect ratio at build time

[gajus]

It is not clear why does next/image require me to add width and height values when this information can be easily inferred from the image itself at build time.

If there is a rational reason for it, I would at least briefly mention it in the documentation.

[danbeneventano]

Width and height are not required. Use the unsized prop.

[Timer]

@danbeneventano width and height are required 99.99% of the time and unsized should only be used as a last resort as it severely hurts performance.

[gajus]

I was going to say. There is a comment:

unsized - When true, the width and height requirement can by bypassed. Should not be used with above-the-fold images. Should not be used with priority.

Thus was my original question – since next.js can infer this information at built time, why doesn't it?

[Timer]

@gajus Next.js cannot infer this information at build time, as we allow you to pass any image URL you want. It does not have to be from the file system. This type of dynamic input cannot be statically analyzed.

We're going to explore a way to import images in the future, which will automatically set the width and height.

[gajus]

@gajus Next.js cannot infer this information at build time, as we allow you to pass any image URL you want. It does not have to be from the file system. This type of dynamic input cannot be statically analyzed.

I would imagine that 99% of users will want to use next/image in a way that explicitly refers to a static asset, e.g.

<Image src={require('../images/foo.png')} />

It would seems a simple improvement to next/image to detect these cases and infer the width / height.

That said... I believe I can do this myself with a simple wrapper. I think.

[Timer]

We're going to explore a way to import images in the future, which will automatically set the width and height.

[Timer]

Closing in favor of this:
https://github.com/vercel/next.js/issues/18497