React version: `18.3.0-canary-9377e1010-20230712`

## Steps To Reproduce

1. Add  `<meta name="viewport" content="width=device-width, initial-scale=1" />` inside of `<head>`
2. Call `ReactDOM.preload('/img.png', { as: 'image' })` 

## The current behavior

The `<link>` generated from the preload is before the `<meta>` for the viewport.

## The expected behavior

The `<link>` should come after the `<meta>` for the viewport.

## Related

- https://github.com/vercel/next.js/issues/53574

cc @gnoff 
externalRuntimeScript: null | ExternalRuntimeScript,
  
  htmlChunks: null | Array<Chunk | PrecomputedChunk>,
  headChunks: null | Array<Chunk | PrecomputedChunk>,
  hasBody: boolean,
  
  charsetChunks: Array<Chunk | PrecomputedChunk>,
  preconnectChunks: Array<Chunk | PrecomputedChunk>,
  preloadChunks: Array<Chunk | PrecomputedChunk>,
  hoistableChunks: Array<Chunk | PrecomputedChunk>,
  
  
  
  stylesToHoist: boolean,
  
  ...
};
const dataElementQuotedEnd = stringToPrecomputedChunk('"></template>');
const startInlineScript = stringToPrecomputedChunk('<script>');
const endInlineScript = stringToPrecomputedChunk('</script>');
const startScriptSrc = stringToPrecomputedChunk('<script src="');
const startModuleSrc = stringToPrecomputedChunk('<script type="module" src="');
const scriptNonce = stringToPrecomputedChunk('" nonce="');
const scriptIntegirty = stringToPrecomputedChunk('" integrity="');
const scriptCrossOrigin = stringToPrecomputedChunk('" crossorigin="');
const endAsyncScript = stringToPrecomputedChunk('" async=""></script>');
/**
 * This escaping function is designed to work with bootstrapScriptContent only.
 * because we know we are escaping the entire script. We can avoid for instance