Firefox will do double request for link header preloaded assets
Hello
My website sends the following HTTP response header: ``` Link: </static/js/main.js>; rel=preload; as=script ``` And within the HTML, just before the body close, I have this: ``` <script src="/static/js/main.js"></script> ``` This causes the script to be loaded twice (in Firefox 85), consuming twice the bandwidth.
I also confirm that by setting `network.preload` to `false` in `about:config` I only get 1 request instead of 2.
Is there a solution to this? I obviously want to preload and only get 1 request.
Keazen oplossing
I filed a bug => https://bugzilla.mozilla.org/show_bug.cgi?id=1694202
Dit antwurd yn kontekst lêze 👍 0Alle antwurden (10)
You requesting twice the same file. Is Firefox behaves differently than any other browser in this example?
I'm requesting it once, in HTML, but also send out the preload Link header to preload the asset before the parsing of HTML.
Yes, Chrome does the right thing, and only fetches the asset once.
This can be seen right now on some other sites I found which demonstrate this issue: - https://www.lefigaro.fr/ - https://www.theguardian.com/international
Chrome only requests it once. I want to preload the JS before HTML parsing has started, that's why I use the Link http response header.
I've never heard of using an HTTP Link header for preloading. However, it sounds as though it should be handled the same as a <link> tag.
Firefox 85 is the first version that implements rel="preload" for <link> tags by default (according to the compatibility table at https://developer.mozilla.org/en-US/docs/Web/HTML/Preloading_content#browser_compatibility). So I think it's timely to file a bug, but perhaps you can find a simpler proof-of concept than the examples above.
Keazen oplossing
I filed a bug => https://bugzilla.mozilla.org/show_bug.cgi?id=1694202
Maybe somebody can set it to block the rel=preload meta bug.
- https://bugzilla.mozilla.org/show_bug.cgi?id=rel%3Dpreload
- Bug 1583604 - (rel=preload) [meta] rel=preload
I assume that the component got selected based on the screenshot that shows the Network Monitor, but should likely be "Core::Networking" like the meta tag.
Bewurke troch cor-el op
I could block rel=preload, but can't switch a component.
This behavior is hard to test for normal use (i.e., not a forced reload).
Reviewing the timing after clearing cache and hitting the URL again, Firefox sometimes starts the second request for the script file before the first one completes, which seems contrary to historical optimizations. However, I also noticed in about:cache that the file appears in two different partitions (one with the origin and one with no origin). Perhaps there is a glitch with how preload works with cache partitioning.
Sorry, I forgot to mention that to repro this you should "Disable Cache" in the Network tab.
In the mean time I had created https://bugzilla.mozilla.org/show_bug.cgi?id=1694134 so feel free to mark either as duplicate. Thanks!
And if you are into some extra info which may help the technical investigation of this, this exact problem happens with fonts as well when the crossorigin option is set like this:
crossorigin
but not when set like this:
crossorigin="anonymous"
which according to MDN should be the same:
> Setting the attribute name to an empty value, like crossorigin or crossorigin="", is the same as anonymous.