Native loading="lazy" lacks dimensions inside gatsby-image.

[eriktiekstra]

Description

I am using the fluid queries within gatsby-image. When using the default loading="lazy", I get the following warning inside the console:

[Intervention] An <img> element was lazyloaded with loading=lazy, but had no dimensions specified. Specifying dimensions improves performance. See https://crbug.com/954323

I tried to search for this issue, but only found 2 unanswered questions on spectrum. I am using gatsby 2.15.11 and gatsby-image 2.2.17. As far as I can see the native lazy-loading has been introduced in gatsby-image 2.1.0.

It also appears on https://using-gatsby-image.gatsbyjs.org/

[ascorbic]

I think the problem here is that fluid images by their nature can't have their size set in the HTML, because they're supposed to resize to fit their container. I'm not sure if there's a way around this (or if it's actually a problem).

[wardpeet]

I've created an upstream issue on chromium https://bugs.chromium.org/p/chromium/issues/detail?id=1002455. Seems like chrome doens't detect fluid containers and mark images without dimensions as faulty. You shouldn't worry about it.

[eriktiekstra]

@ascorbic
It is a warning, so nothing breaks the site. I just like to keep my console clean, so I thought to make people aware of it.

@wardpeet Thanks for creating an issue on chromium, I actually didn't think of that it could be an issue in the browser. It makes sense though.

[gatsbot]

Hiya!

This issue has gone quiet. Spooky quiet. 👻

We get a lot of issues, so we currently close issues after 30 days of inactivity. It’s been at least 20 days since the last update here.

If we missed this issue or if you want to keep it open, please reply here. You can also add the label "not stale" to keep this issue open!

As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

Thanks for being a part of the Gatsby community! 💪💜

[gatsbot]

Hey again!

It’s been 30 days since anything happened on this issue, so our friendly neighborhood robot (that’s me!) is going to close it.

Please keep in mind that I’m only a robot, so if I’ve closed this issue in error, I’m HUMAN_EMOTION_SORRY. Please feel free to reopen this issue or create a new one if you need anything else.

As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

Thanks again for being part of the Gatsby community!

[jimmyandrade]

👀

[olee]

This issue is still relevant and should be reopened I think