Link to the code that reproduces this issue
https://codesandbox.io/p/devbox/next-js-15-d55c3c
To Reproduce
- Run the application in development mode (next dev).
- Check the response headers: the Link header for critical resources (e.g., fonts, styles) is present.
- Build the application for production (next build and next start) or deploy it to Vercel in preview or production mode.
- In production, the Link header is missing.
Current vs. Expected behavior
-
Current behavior:
In development mode, the Link header correctly includes critical resources to preload, such as fonts and stylesheets. However, in production or preview (e.g., on Vercel), the Link header is not present, and resources are not preloaded in the same way.
-
Expected behavior:
The Link header should also be present in production mode, allowing the browser to preload critical resources and potentially enable optimizations like 103 Early Hints.
Provide environment information
Operating System:
Platform: win32
Arch: x64
Version: Windows 11 Pro
Available memory (MB): 32547
Available CPU cores: 20
Binaries:
Node: 20.11.1
npm: N/A
Yarn: N/A
pnpm: N/A
Relevant Packages:
next: 15.0.1 // Latest available version is detected (15.0.1).
eslint-config-next: 15.0.1
react: 19.0.0-rc-69d4b800-20241021
react-dom: 19.0.0-rc-69d4b800-20241021
typescript: 5.6.3
Next.js Config:
output: N/A
Which area(s) are affected? (Select all that apply)
Output (export/standalone), Performance
Which stage(s) are affected? (Select all that apply)
next build (local), next start (local), Vercel (Deployed)
Additional context
The problem also occurs with the default nextjs template, implemented with “npx create-next-app”
I believe I found the logic that handles critical resources in the Link header in the following file:
|
linkHeader ? onHeaders({ Link: linkHeader }) : onHeaders({}); |
The function safelyEmitEarlyPreloads seems to generate the Link header correctly during rendering, but it doesn't appear to be emitted in production. Is there a new option or configuration that needs to be enabled to have these critical resources included in the Link header during production? This would be particularly useful for enabling 103 Early Hints.
Thank you for any insights!
Link to the code that reproduces this issue
https://codesandbox.io/p/devbox/next-js-15-d55c3c
To Reproduce
Current vs. Expected behavior
Current behavior:
In development mode, the Link header correctly includes critical resources to preload, such as fonts and stylesheets. However, in production or preview (e.g., on Vercel), the Link header is not present, and resources are not preloaded in the same way.
Expected behavior:
The Link header should also be present in production mode, allowing the browser to preload critical resources and potentially enable optimizations like 103 Early Hints.
Provide environment information
Which area(s) are affected? (Select all that apply)
Output (export/standalone), Performance
Which stage(s) are affected? (Select all that apply)
next build (local), next start (local), Vercel (Deployed)
Additional context
The problem also occurs with the default nextjs template, implemented with “npx create-next-app”
I believe I found the logic that handles critical resources in the Link header in the following file:
next.js/packages/next/src/compiled/react-dom-experimental/cjs/react-dom-server.node.production.js
Line 5723 in 51d6e76
The function safelyEmitEarlyPreloads seems to generate the Link header correctly during rendering, but it doesn't appear to be emitted in production. Is there a new option or configuration that needs to be enabled to have these critical resources included in the Link header during production? This would be particularly useful for enabling 103 Early Hints.
Thank you for any insights!