@astro/image should call out usage of content-visibility attribute

[susickypavel]

Hi 👋

Today, I've spent a large amount of time debugging an issue about image not rendering when coming to viewport. After checking my code for flaws in animation, I found out that the issue was usage of content-visibility property which should alter the default behaviour of image rendering. It should be mentioned in some way that this property is declared by default by Picture/Image.

[delucis]

Tagging in @tony-sull for an opinion here so we can discuss what kind of docs this might need.

[susickypavel]

I think it could be batched together in some callout. I'd like to see something like Image and Picture components are optimized by default by the integration, so attributes like loading, decoding, and property content-visibility have optimized defaults (but they could lead to weird edge cases). Since lazy loading images in the initial viewport is wasteful and harms the website's FCP/LCP, I'd say such a callout could be helpful.

[sarah11918]

11 days is a long time in Astro Image Integration land! 😅

I will make sure that I touch base on this with @tony-sull as developments are happening rapidly, and we'll keep this on everyone's radar!

[tony-sull]

Sorry for the late reply, this got lost in my GitHub notifications somewhere along the way 😞

It might make sense for us to just remove that style on <Picture /> - we don't add any other styling by default, no reason we can't leave that up to users to include if their layout needs it 🤔

[delucis]

Sounds like this is a non-docs issue then, so hope it’s OK if I close this here for now with the intention that it gets resolved upstream.