Early Hints problems

Setup

This response sends a Link header with three preloads. The Swiper URLs include a cache-busting timestamp parameter; the Axios URL does not.

Both the script tag and stylesheet tag in the HTML include SRI/integrity.

The final response is delayed by 500ms so it is easier to see whether each file was loaded from Early Hints or from the main response.

Problem 1: preload with integrity

When Chrome sees a preload with integrity in Early Hints, it bails from preloading any file from them, while it still does preload from the Link header in the main response.

Caveat: this may be an issue with how Cloudflare does not wrap the integrity attribute with quotes in Early Hints, but the preload from the main response still works, so...

Problem 2: preload without integrity for an SRI-protected resource

If integrity is omitted from the Early Hints preload, Chrome may fetch the file early, but the preload cannot be reused by the HTML request that has integrity.

DevTools reports this as: "A preload is found, but is not used due to an integrity mismatch."

This means there is no good option for SRI-protected resources: adding integrity prevents Early Hints preloading, while omitting integrity causes the preload to be discarded for the final SRI request.

Problem 3: invisible Early Hints

Early-Hinted files are not visible in Chrome DevTools Network waterfall as Early Hints requests.

The only clear signal they happened is the Console warning that they were preloaded but not actually used.

The 500ms response delay is here so timing makes the difference easier to spot.