Allow "style" and "json" in `as` attribute for `modulepreload` #11981

KurtCattiSchmidt · 2025-12-02T19:26:51Z

Updates the definition of modulepreload to support as="style" and as="json" for preloading style and JSON module scripts respectively. Also removes as=json for rel=preload, as the only use for preloading JSON is for a module import, so it might as well directly add it to the module graph via modulepreload. There were some inconsistencies with the existing spec's supported as values for rel=preload, which this PR fixes with the introduction of a "preload destination" concept, which includes all supported types.

Fixes #10233

At least two implementers are interested (and none opposed):
- Chromium
- WebKit
Tests are written and can be reviewed and commented upon at:
- [CSS Modules] Add tests for modulepreload links with JSON and CSS, remove json with non-module preload web-platform-tests/wpt#56617
Implementation bugs are filed:
- Chromium: https://issues.chromium.org/issues/466888680
- Gecko: https://bugzilla.mozilla.org/show_bug.cgi?id=2004751
- WebKit: https://bugs.webkit.org/show_bug.cgi?id=303761
Corresponding HTML AAM & ARIA in HTML issues & PRs: N/A, as this feature is unrelated to accessibility.
MDN issue is filed: PR here: Updates to modulepreload and preload to incorporate WHATWG changes for "style" and "json" mdn/content#42333
The top of this comment includes a clear commit message to use.

(See WHATWG Working Mode: Changes for more details.)

/acknowledgements.html ( diff )
/indices.html ( diff )
/links.html ( diff )
/semantics.html ( diff )

annevk

Should we also disallow "json" for <link rel=preload>?

source

KurtCattiSchmidt · 2025-12-05T22:04:36Z

Should we also disallow "json" for <link rel=preload>?

You're right, "json" doesn't really make sense in preload if it's supported for modulepreload. I think this should be handled separately though, because WebKit recently added support for <link rel=preload as=json>, and we can have both for some window of time.

Filed #11995 to track and discuss separately.

annevk · 2025-12-08T07:20:55Z

I'd rather tackle them together as I have a feeling #11995 will not be addressed anytime soon otherwise. And it would be good to have that infrastructure in place as we add more types, such as text and bytes.

KurtCattiSchmidt · 2025-12-08T17:40:28Z

I assumed there would be some window of overlap between the new and deprecated version, which is why I filed a separate bug. But if we can do them in one shot that's great. This feature is a little different in that it's not directly observable, so it does seem safe to just deprecate.

I'll update this PR to remove <link type="preload" as="json"> today.

@rniwa - you recently added support for <link type="preload" as="json"> in WebKit so your input here is appreciated.

KurtCattiSchmidt · 2025-12-08T21:55:59Z

Latest push handles removing "json" for "preload". I also added the implementation bugs. I'll work on tests next.

KurtCattiSchmidt · 2025-12-09T22:55:04Z

Tests and MDN PR's have been are added, so the only missing part in compliance above is "two implementors are interested". @rniwa - can you give a WebKit position in https://bugs.webkit.org/show_bug.cgi?id=303761?

bakkot · 2025-12-11T21:18:54Z

Note that the set of module types might be expanding - there's active proposals for text and bytes imports from JS.

KurtCattiSchmidt · 2025-12-12T01:54:12Z

@annevk - you mentioned a missing conformance section for the as attribute, but I don't see an existing section for it, just https://html.spec.whatwg.org/#attr-link-as. Is this something I should add? Or is the table I edited in this PR under https://html.spec.whatwg.org/#attributes-3 sufficient?

annevk · 2025-12-17T09:28:04Z

@KurtCattiSchmidt those are the conformance requirements. You'll have to adjust the wording there to make it clear json is not a valid potential destination. Maybe something like:

Each potential destination except for "json" is a keyword for this attribute ...

Or maybe define preload destination as a concept which takes care of that.

KurtCattiSchmidt · 2025-12-18T00:55:12Z

Thanks @annevk - it was awkward updating "potential destination" to exclude "json" everywhere, so I added a preload destination concept. This reduced some duplication elsewhere too.

source

smaug---- · 2025-12-18T16:37:13Z

source

@@ -16396,18 +16390,23 @@ interface <dfn interface>HTMLLinkElement</dfn> : <span>HTMLElement</span> {

  <hr>

+  A <dfn data-x="concept-preload-destination">preload destination</dfn> is a <span
+  data-x="concept-potential-destination">potential destination</span>, excluding "<code
+  data-x="">json</code>" when used with <code data-x="rel-preload">preload</code> links, and is


Excluding a single thing this way is a bit icky special case, and special cases tend to cause issues later. Would there be some other way to express this (if we need to exclude json. Not sure why we need to, but perhaps it doesn't matter too much.).

We might have to exclude more module destination types going forward. One way to avoid this would be to refactor Fetch's destination concept to have subtypes or some such. But not sure we need to go there right away.

Added a "preload destination" concept in the latest push that instead lists all supported module types (in addition to the "module preload destination" concept added for module preloads).

noamr · 2025-12-18T17:28:43Z

Should we also disallow "json" for <link rel=preload>?

It's already disallowed. See https://html.spec.whatwg.org/multipage/links.html#translate-a-preload-destination
It's probably enough to add json and style to modulepreload specifically.

KurtCattiSchmidt · 2025-12-18T18:31:22Z

Should we also disallow "json" for <link rel=preload>?

It's already disallowed. See https://html.spec.whatwg.org/multipage/links.html#translate-a-preload-destination It's probably enough to add json and style to modulepreload specifically.

Not exactly, https://html.spec.whatwg.org/#consume-a-preloaded-resource lists JSON as a preload destination. I reverted to the prior commit in this PR, which removes that part and adds "style" and "json" to modulepreload. Does this version look correct @noamr?

KurtCattiSchmidt · 2026-01-08T19:46:30Z

The latest push addresses everything discussed this morning (returned conformance section, listed all supported values as a "preload destination" concept).

noamr · 2026-01-08T21:43:00Z

source

+  data-x="">audio</code>", "<code data-x="">fetch</code>", "<code data-x="">font</code>", "<code
+  data-x="">image</code>", "<code data-x="">style</code>", "<code data-x="">track</code>", "<code
+  data-x="">video</code>", or a <span
+  data-x="concept-script-like-destination">script-like destination</span>.


This is a change in behavior. Do we know if e.g. <link rel=preload as="sharedworker"> works or supposed to work?
I see that the test variants don't cover this.
Maybe keep it as script and we can check if it works for other script-like destinations separately?

This test covers it: https://wpt.fyi/results/fetch/api/request/destination/fetch-destination.https.html?label=master&label=experimental&aligned&q=fetch-destination.https.html

The "Consume a Preloaded Resource" section lists all script-like destinations as supported: https://html.spec.whatwg.org/#consume-a-preloaded-resource

(it's in step 6 of "For the purposes of this section, a string type matches a string destination if the following algorithm returns true:" under "If any of the following are true:...")

I think limiting it to "script" would be a change in behavior given the above. But perhaps that is incorrect and it should be "script" there instead of "script-like destination". Note that Chrome logs an error that it's valid but unsupported with "sharedworker" (see the links here #11981 (comment)).

…tination`

…rt is used

source

annevk · 2026-01-13T08:30:29Z

source

-  destination</span>. For other <code>link</code> elements, it must not be specified.</p>
+  have a value which is a <span
+  data-x="concept-module-preload-destination">module preload destination</span>. For other
+  <code>link</code> elements, it must not be specified.</p>


I don't think this quite works. Initially when we introduce the attribute we should say it takes either a preload or module preload destination. Then we should say that each destination of the union of these destinations is a keyword, mapping to a state of the same name. Otherwise the enumerated attribute definition doesn't work.

Then we restrict per rel attribute value what keywords are valid.

You're right, this is much clearer now. I moved "This is an enumerated attribute" to be before listing the valid values. It was a little awkward phrasing "the union of..." but I think the latest version is decent.

source

annevk · 2026-01-13T08:31:16Z

source

@@ -29009,13 +28985,16 @@ document.body.appendChild(wbr);</code></pre>
  data-x="concept-request-credentials-mode">credentials mode</span>.</p>
  </div>

+  A <dfn data-x="concept-preload-destination">preload destination</dfn> is "<code


Per above, I had to remove the "concept-" prefix for this to compile. This revealed that there's already a definition for "preload destination" that listed a string, which I changed to point to the full list of preload destinations.

source

annevk

This looks great @KurtCattiSchmidt, thanks for tidying it all up. @smaug---- @noamr any final thoughts?

I suggest we merge this Monday next week.

source

noamr · 2026-01-15T12:59:12Z

This looks great @KurtCattiSchmidt, thanks for tidying it all up. @smaug---- @noamr any final thoughts?

I suggest we merge this Monday next week.

Re-read the PR, looks good to me!

KurtCattiSchmidt · 2026-01-15T16:55:24Z

This looks great @KurtCattiSchmidt, thanks for tidying it all up. @smaug---- @noamr any final thoughts?
I suggest we merge this Monday next week.

Re-read the PR, looks good to me!

@noamr - would you mind hitting the +1 button again? You had previously approved, but it reset when I re-requested review.

KurtCattiSchmidt · 2026-01-15T17:06:51Z

This looks great @KurtCattiSchmidt, thanks for tidying it all up. @smaug---- @noamr any final thoughts?

I suggest we merge this Monday next week.

Thanks Anne! We have a holiday on Monday so I'll plan on landing on Tuesday unless any new issues arise.

annevk · 2026-01-16T06:18:16Z

The editors will take care of the merging (and are available on Monday). Unless you wanted to push it back one day? Though it wouldn't give the US an extra day so then we'd have to merge Wednesday.

KurtCattiSchmidt · 2026-01-16T18:32:24Z

If someone else is merging then Monday is fine with me, thanks for checking.

KurtCattiSchmidt added 2 commits December 2, 2025 11:06

Initial commit

4648338

Wrapping json and style in <code> blocks

9ba538e

KurtCattiSchmidt changed the title ~~Expanding <link type="modulepreload"> to allow "style" and "json" in as attribute~~ Allow "style" and "json" in as attribute in modulepreload Dec 2, 2025

KurtCattiSchmidt changed the title ~~Allow "style" and "json" in as attribute in modulepreload~~ Allow "style" and "json" in as attribute for modulepreload Dec 2, 2025

KurtCattiSchmidt mentioned this pull request Dec 3, 2025

Upcoming WHATNOT meeting on 2025-12-04 #11982

Closed

annevk reviewed Dec 3, 2025

View reviewed changes

source Outdated Show resolved Hide resolved

KurtCattiSchmidt mentioned this pull request Dec 5, 2025

Deprecate JSON as preload destination in favor of modulepreload #11995

Open

KurtCattiSchmidt added 2 commits December 5, 2025 14:13

Adding comma, fixing line breaking, and adding missing 'destination'

901f5ea

Fixing trailing whitespace

d0b0497

Removing JSON from preload

7bf83f8

This was referenced Dec 9, 2025

[CSS Modules] Add tests for modulepreload links with JSON and CSS, remove json with non-module preload web-platform-tests/wpt#56617

Open

Updates to modulepreload and preload to incorporate WHATWG changes for "style" and "json" mdn/content#42333

Open

KurtCattiSchmidt mentioned this pull request Dec 11, 2025

Upcoming WHATNOT meeting on 2025-12-11 #11989

Closed

KurtCattiSchmidt mentioned this pull request Dec 15, 2025

Upcoming WHATNOT meeting on 2025-12-18 #12015

Closed

Adding preload destination concept

74887d7

cwilso added the agenda+ To be discussed at a triage meeting label Dec 18, 2025

noamr reviewed Dec 18, 2025

View reviewed changes

source Outdated Show resolved Hide resolved

smaug---- reviewed Dec 18, 2025

View reviewed changes

Removing preload destination concept

c0cbc7e

Adding back preload destination and instead listing all valid types

4991588

noamr reviewed Jan 8, 2026

View reviewed changes

KurtCattiSchmidt added 2 commits January 8, 2026 16:49

Limiting preload destinations to subset from 'Translate a preload des…

d233654

…tination`

Removing reference to Potential Destination, as only the translate pa…

36fdd25

…rt is used

dandclark reviewed Jan 9, 2026

View reviewed changes

source Show resolved Hide resolved

Adding potential destination reference back in.

4fa5df6

annevk reviewed Jan 13, 2026

View reviewed changes

KurtCattiSchmidt added 2 commits January 13, 2026 10:46

Removing concept- bits, duplicated preload destination, rephrasing

a397e64

Rephrasing awkward langauge

98334aa

annevk reviewed Jan 14, 2026

View reviewed changes

source Outdated Show resolved Hide resolved

source Outdated Show resolved Hide resolved

source Outdated Show resolved Hide resolved

source Outdated Show resolved Hide resolved

source Outdated Show resolved Hide resolved

KurtCattiSchmidt added 4 commits January 14, 2026 22:49

Formatting and rephrasing of destination paragraphs

ad0a0c5

Adding missing preload destination <span>

183eeb8

Removing unnecessary data-x

f731d98

Fixing wrapping

29303c7

KurtCattiSchmidt requested review from annevk, dandclark, noamr and smaug---- January 15, 2026 00:53

annevk approved these changes Jan 15, 2026

View reviewed changes

source Outdated Show resolved Hide resolved

Adding comma

23b7513

cwilso removed the agenda+ To be discussed at a triage meeting label Jan 15, 2026

noamr approved these changes Jan 15, 2026

View reviewed changes

cwilso mentioned this pull request Jan 15, 2026

Upcoming WHATNOT meeting on 2026-01-15 #12067

Closed

dandclark approved these changes Jan 16, 2026

View reviewed changes

Allow "style" and "json" in as attribute for modulepreload #11981

Are you sure you want to change the base?

Allow "style" and "json" in as attribute for modulepreload #11981

Uh oh!

Conversation

KurtCattiSchmidt commented Dec 2, 2025 • edited by pr-preview bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

annevk left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

KurtCattiSchmidt commented Dec 5, 2025

Uh oh!

annevk commented Dec 8, 2025

Uh oh!

KurtCattiSchmidt commented Dec 8, 2025

Uh oh!

KurtCattiSchmidt commented Dec 8, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

KurtCattiSchmidt commented Dec 9, 2025

Uh oh!

bakkot commented Dec 11, 2025

Uh oh!

KurtCattiSchmidt commented Dec 12, 2025

Uh oh!

annevk commented Dec 17, 2025

Uh oh!

KurtCattiSchmidt commented Dec 18, 2025

Uh oh!

Uh oh!

smaug---- Dec 18, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

annevk Jan 8, 2026

Choose a reason for hiding this comment

Uh oh!

KurtCattiSchmidt Jan 8, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

noamr commented Dec 18, 2025

Uh oh!

KurtCattiSchmidt commented Dec 18, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

KurtCattiSchmidt commented Jan 8, 2026

Uh oh!

noamr Jan 8, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

KurtCattiSchmidt Jan 8, 2026

Choose a reason for hiding this comment

Uh oh!

KurtCattiSchmidt Jan 8, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

KurtCattiSchmidt Jan 9, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

annevk Jan 13, 2026

Choose a reason for hiding this comment

Uh oh!

KurtCattiSchmidt Jan 13, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

annevk Jan 13, 2026

Choose a reason for hiding this comment

Uh oh!

KurtCattiSchmidt Jan 13, 2026

Choose a reason for hiding this comment

Uh oh!

Allow "style" and "json" in `as` attribute for `modulepreload` #11981

Allow "style" and "json" in `as` attribute for `modulepreload` #11981

KurtCattiSchmidt commented Dec 2, 2025 •

edited by pr-preview bot

Loading

annevk left a comment •

edited

Loading

KurtCattiSchmidt commented Dec 8, 2025 •

edited

Loading

smaug---- Dec 18, 2025 •

edited

Loading

KurtCattiSchmidt Jan 8, 2026 •

edited

Loading

KurtCattiSchmidt commented Dec 18, 2025 •

edited

Loading

noamr Jan 8, 2026 •

edited

Loading

KurtCattiSchmidt Jan 8, 2026 •

edited

Loading

KurtCattiSchmidt Jan 9, 2026 •

edited

Loading