← Back to release summary

Auto Sizes for Lazy Loaded Images with Srcset

Category
Multimedia
Type
New or changed feature
Status
Enabled by default (Chrome 126)
Intent stage
Start prototyping

Summary

Auto Sizes allows developers to set the sizes attribute to auto (sizes=auto) for lazy loaded image elements with srcset. For this use case the image's width and height should be provided. The browser will use the layout width of the image in order to select the source url from the srcset.

Motivation

The layout size information in sizes is redundant with layout information in CSS, but for images that are critical to initial paint it's necessary to have the information in the HTML. For lazy-loaded images, CSS will usually be available before the image load begins. The browser could take the actual width of the image as specified in CSS, and use that as if it was the image's sizes.

Standards & signals

Explainers: https://github.com/whatwg/html/issues/4654

View on chromestatus.com