Dynamically inserted script for large requests create duplicate fetches
Categories
(Core :: DOM: Core & HTML, defect)
Tracking
()
People
(Reporter: alexander, Unassigned)
Details
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:102.0) Gecko/20100101 Firefox/102.0
Steps to reproduce:
We have an application that server renders a request and provides the required script tags in the response. Once loaded the client side JavaScript takes over and ensures interactivity.
Because the client side script does not know which scripts were already preloaded it will try to load whatever it needs by inserting script-tags dynamically (though using import has the same result).
As part of a Twitter discussion (https://twitter.com/Kingdutch/status/1545359813533728769?s=20&t=-pDjel6QGzB9xoBibwMFQQ) I had created a small reproduction case here: https://github.com/Kingdutch/module-load-test/tree/fix but it turns out that for this simple case Firefox is able to correctly deduplicate the issue.
The larger application is unfortunately not yet open source.
Actual results:
For an initial uncached request the scripts are fetched initially. Subsequent insertions of the script tags cause network requests that are shown to be handled by the cache: https://pbs.twimg.com/media/FXJCKEZXoAYpJgm?format=jpg&name=large
When the cache is disabled (or a reload is forced with shift + cmd + r) the subsequent requests will also hit the network and scripts will be downloaded multiple times: https://pbs.twimg.com/media/FXJCKEbXoAEOHqE?format=jpg&name=large
Expected results:
import() calls or dynamically inserted <script type="module" src="" [async]> should not trigger network requests at all for scripts that have already been loaded in the current session.
Chrome behaves correctly for the example application: https://pbs.twimg.com/media/FXJCg-9XgAMNlnF?format=jpg&name=large
|
||
Comment 1•3 years ago
|
||
The Bugbug bot thinks this bug should belong to the 'DevTools::Netmonitor' component, and is moving the bug to that component. Please correct in case you think the bot is wrong.
Moved this back to Firefox as product after verifying with Wireshark that requests were actually sent multiple times and not just shown as being sent multiple times but deduplicated behind the scenes. Whireshark also showed that requests were sent multiple times when DevTools was closed.
|
||
Updated•3 years ago
|
After further investigation trying to get a replication case going it appears that this is not in fact a Firefox bug but is caused by a polyfill introduced by the Vite bundler to cover for Firefox' lack of module preload support. A bug report that was filed can be found in the Vite issue queue: https://github.com/vitejs/vite/issues/5532
Description
•