Closed
Description
React version: 18.3.0-canary-a389046a5-20230512
Steps To Reproduce
- Server render a React component that renders either
<script>or<link>tags withfetchpriorityset - Observe that React will add
<link rel="preload">links for each of the discovered resources but without the same fetchpriority set.
Link to code example:
The current behavior
Currently, if we server render a component such as the one below:
<html lang="en">
<head>
<link rel="stylesheet" href="/styles.css" fetchpriority="low" ></link>
</head>
<body>
<script src="/script.js" fetchpriority="low" ></script>
</body>
</html>
React will also render preload links for the script and link but without the fetchpriority set:
<head>
<link rel="preload" as="style" href="/styles.css" />
<link rel="preload" as="script" href="/script.js" />
<link rel="stylesheet" href="/styles.css" fetchpriority="low" ></link>
</head>
<body>
<script src="/script.js" fetchpriority="low"></script>
</body>
The result is that both styles.css and script.js are fetched with fetchpriority set to high
The expected behavior
When generating preload links for script and link components, React should respect fetchpriority if specified.