[✨] use modulepreload if supported

[GrandSchtroumpf]

Is your feature request related to a problem?

Using a web worker to fetch and cache modules requires an additional network and only cache the request (not parsed nor compiled)

Describe the solution you'd like

MDN: https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel/modulepreload

modulepreload provides a way to fetch, cache, parse, compile the module and its script graph it ahead of time.
The documentation mentions that the main reason not to use modulepreload is that support is not good, so we need backward compatibilty.

In the server: Qwik add

• <link rel="modulepreload" href="..." as="script" /> for every module required for the page.
• <link rel="modulepreload" href="..." as="serviceworker" /> for the main serviceworker.

In the client: 2 options

1. Qwik verifies if modulepreload is supported by browser, if so, do not emit workerFetchInsert,
2. Qwik keeps emitting workerFetchInsert event and if modulepreload has already worked, then file would already be in the cache anyway

Here is a way to verify if browser supports modulepreload :

const href = document.querySelector('link[rel="modulepreload"]').href;
const cache = await caches.open('QwikBuild');
const keys = await caches.keys(new Request(href));
if (keys.length) return;
// backward compatibilty: emit `workerFetchInsert`

Describe alternatives you've considered

Keep using fetch() in web worker but we miss the parse & compile operation

Additional context

No response

[gioboa]

We moved this issue to qwik-evolution repo to create a RFC discussion for this.
Here is our Qwik RFC process thanks.