Provide a straightforward way to manually write preloads in the Metadata object.

[MGSimard]

Goals

1. Allows us to manually preload images used as css backgrounds.
2. Avoid having to use an invisible <Image /> component in layout to force a preload inclusion in head.
3. The docs info from pic below is false, on latest Canary you still get an error when not including explicit width/height attributes with public srcs.

4. Stop hamfisting your way into inconveniencing devs from using some of the most fundamental features in web development just because you want to make more money. <Image /> can be useful, this is not the case for it. It feels like your pricing model is the only plausible reasoning as to why there's no straightforward way to manually set preloads for background images.

Non-Goals

No response

Background

Do I really need to explain why granular control over our preloads is a necessity, instead of shoving a priced service down devs' throats pretending you know better in all contexts?

PS: The next best alternative if you do want optimization on top is https://next-bg-image.kiahjh.com/, but this isn't my use case + I'm leveraging ::before for dotted overlays as well.

Proposal

1. Add a "preloads" key to the Metadata object instead of whatever monstrosity we're forced to do for both image and font preloads at the moment
2. This request is my contribution, this sort of impedance is like 50% of the criticism against Nextjs