✦ Continue with Google
AI & Agent Dev Bug Sandbox logo
AI & Agent Dev Bug SandboxBack to Radar

Missing Preload Hint For CSS Chunks In Next.Js App Router

Next.js App Router emits <link rel="stylesheet"> without a companion <link rel="preload"> for CSS chunks, hurting performance metrics such as Lighthouse network dependency tree.

mediumConfidence 72%Next.jsAffected V13.4.0 - 16.2.4

Origin Analysis

The getLinkAndScriptTags function in app-render.tsx only generates stylesheet links for CSS assets; it lacks logic to emit preload hints, which are essential for early resource discovery.
1. Create a Next.js App Router project with multiple CSS files. 2. Run `next build && next start`. 3. Inspect page HTML head. 4. Observe only stylesheet links without preload.

Fixing Code Block

// packages/next/src/server/app-render/app-render.tsx // Inside getLinkAndScriptTags function, replace the styles array push for css files with: const href = `${assetPrefix}/_next/${file}`; styles.push( <link rel="preload" href={href} as="style" key={`preload-${file}`} />, <link rel="stylesheet" href={href} data-precedence="next" key={file} /> );
Preload hints tell the browser to fetch CSS earlier without blocking render, reducing critical request chain length.

Edge Case Audit

Applying this patch modifies internal HTML output; ensure existing tests that assert exact link order are updated. If performance regressions occur due to duplicate requests (unlikely as preload is cacheable), revert the patch immediately. Works only for App Router, not Pages Router.

Related Intelligence

highTurbopack CSS HMR serves one-revision-stale output when PostCSS plugins report dependenciesmedium文档缺少对重定向URL中code参数的处理说明，导致用户无法完成OAuth登录mediumnext/image in dev does not update local image after file edit with same filenamemediumMetadata descriptions with Windows carriage returns cause duplicate <meta> tags during hydrationmediumPages Router hydration causes an extra client render on full page load when any rewrite is configured, including non-rewritten routeshighTurbopack crashes in pages/_app.tsx when next/font is imported

Ecosystem Topology

Latest critical and high reports

Agent Frameworks

LangChain, LlamaIndex, and Pydantic

LangChainLlamaIndexPydantic
  1. highStructured output fails when appending assistant response as JSON in multi-turn conversation
  2. highcore: _convert_openai_format_to_data_block hard-codes mime_type on base64 file blocks
  3. highMCP Apps UI resources are silently converted to plain text, losing structure and interactivity
  4. highDuplicate tool_calls in content_blocks when using OpenAI Responses API streaming
  5. highcreate_agent with ProviderStrategy binds empty tools list and breaks OpenAI-compatible providers