Skip to content

auto-sizes concrete object size ignoring natural dimensions is not implementable #9448

@zcorpan

Description

@zcorpan

Feedback from @progers in https://chromium-review.googlesource.com/c/chromium/src/+/4520266/comment/d6012d27_30cf4ea2/ about concrete object size ignoring natural dimensions introduced in #8008

If I understand the intended behavior, I think it may not be implementable.

The goal of the spec was to get stable, predictable, non-racy loading behavior of auto-sizes images. Therefore the natural dimensions of the loaded image shouldn't cause a different image to be selected from srcset.

Consider a page like this:

<img loading=lazy sizes=auto srcset="a 2w, b 4w, c 8w, d 16w, ..." style="min-width: 1px">

The layout width before loading anything is 1px, so maybe the browser would select a. When that has loaded, the layout width changes to 2px, which could cause the browser to instead select b. And so on until the largest image has loaded.

The spec checks for 0px concrete object size ignoring natural dimensions and translates auto to 100vw. But since min-width can be used, the image's natural dimensions can still affect the layout size as shown above.

@emilio pointed out that the natural dimensions can affect outer elements, so it's not easy to determine the concrete object size ignoring natural dimensions without doing full layout twice.

So I think we need a different approach here. Maybe checking if there's a specified 'width' (or 'height' + 'aspect-ratio'), and if not use 100vw. Any other ideas?

cc @tcaptan-cr @yoavweiss

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions