[template-renderer] Make it possible to not automatically render used async scripts

What problem does this feature solve?

In oder to make https://github.com/maoberlehner/vue-lazy-hydration more useful it would be great if we could prevent the template renderer from automatically injecting async scripts. The way vue-lazy-hydration works is, that it behaves differently on the server than it does on the client. On the server the script (of an async component) is loaded immediately so the template renderer correctly detects that it is used. But on the client the script might not be needed at all but because the template renderer has already injected it it is immediately loaded on page load.

There is currently kind of a backlash against loading huge amounts of JavaScript. vue-lazy-hydration can help with removing a lot of unnecessary JavaScript on server side rendered, mostly static sites like blogs and documentation. But currently it can’t completely prevent loading all of the unnecessary JavaScript because of the way how template renderer works.

Here is the relevant line in the code: https://github.com/vuejs/vue/blob/dev/src/server/template-renderer/index.js#L226

What does the proposed API look like?

I propose to make this configurable:

const renderer = createBundleRenderer(serverBundle, {
  template,
  renderUsedAsyncScripts: false,
});

[simllll]

this is the related PR https://github.com/vuejs/vue/pull/10794 anything we can do to get this into the core?

[simplenotezy]

That would be neat, Vue & Nuxt applications would see a huge performance boost, especially on LightHouse scores.