Skip to content

Meta: lazy-load the spec's own images and iframes - #12867

Merged
zcorpan merged 3 commits into
mainfrom
zcorpan/use-lazy-load
Sep 15, 2026
Merged

zcorpan merged 3 commits into
mainfrom
zcorpan/use-lazy-load

Conversation

@zcorpan

@zcorpan zcorpan commented Aug 31, 2026

Copy link
Copy Markdown
Member

Add loading="lazy" to every <img> and <iframe> in the spec, except the WHATWG logo in the header, to improve page loading performance.

Six images had no dimensions to lay out with while unloaded, and so would have shifted layout on scroll. They now carry width and height attributes: the intrinsic sizes for sample-bdi.png, sample-not-bdi.png, select-country-1.png, and select-country-2.png, and sizes matching the viewBox aspect ratio for asyncdefer.svg and custom-element-reactions.svg, whose rendered size continues to come from their style attributes.

Part of #12782.

Add `loading="lazy"` to every `<img>` and `<iframe>` in the spec, except the
WHATWG logo in the header, to improve page loading performance.

Six images had no dimensions to lay out with while unloaded, and so would have
shifted layout on scroll. They now carry `width` and `height` attributes: the
intrinsic sizes for `sample-bdi.png`, `sample-not-bdi.png`,
`select-country-1.png`, and `select-country-2.png`, and sizes matching the
`viewBox` aspect ratio for `asyncdefer.svg` and `custom-element-reactions.svg`,
whose rendered size continues to come from their `style` attributes.

Part of #12782.
Comment thread source Outdated
Comment thread source Outdated
Comment thread source Outdated
Comment thread source Outdated
@zcorpan

zcorpan commented Sep 1, 2026

Copy link
Copy Markdown
Member Author

specfmt will wrap image markup to 100 cols, but most images are on a single line. It seems there was likely an a11y reason to have alt values on a single line:

https://web.archive.org/web/20251211020906/https://www.tpgi.com/short-note-on-coding-alt-text/
https://krijnhoetmer.nl/irc-logs/whatwg/20070905#l-388

I'll look into codifying this in https://github.com/whatwg/html/blob/main/.github/CONTRIBUTING.md#source-formatting and specfmt.

@zcorpan

zcorpan commented Sep 1, 2026

Copy link
Copy Markdown
Member Author

@zcorpan zcorpan added the do not merge yet Pull request must not be merged per rationale in comment label Sep 7, 2026
@zcorpan

zcorpan commented Sep 7, 2026

Copy link
Copy Markdown
Member Author

Let's wait for domfarolino/specfmt#33 so that the wrapping doesn't flip-flop.

@zcorpan zcorpan removed the do not merge yet Pull request must not be merged per rationale in comment label Sep 15, 2026
@zcorpan
zcorpan merged commit a4c6a59 into main Sep 15, 2026
2 checks passed
@zcorpan
zcorpan deleted the zcorpan/use-lazy-load branch September 15, 2026 12:21
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Development

Successfully merging this pull request may close these issues.

2 participants