Skip to content

Link prefetch calls generateMetadata when streaming #80583

@kmsomebody

Description

@kmsomebody

Link to the code that reproduces this issue

https://codesandbox.io/p/devbox/awesome-meninsky-hv2k2r?workspaceId=ws_Wn1etLdni3NB1TGjgQrK6W

To Reproduce

Here are the key steps of what the reproduction link does:

  1. Create a dynamic page with a loading.tsx and generateMetadata
  2. Add links to this dynamic page
  3. Run production server

Current vs. Expected behavior

The current behavior shows that generateMetadata is called for every link in the viewport. This causes a lot of data to be fetched.

Expected behavior:
Only loading.tsx should be prefetched.

Provide environment information

Operating System:
  Platform: win32
  Arch: x64
  Version: Windows 11 Pro
  Available memory (MB): 65304
  Available CPU cores: 32
Binaries:
  Node: 22.14.0
  npm: 10.9.0
  Yarn: 1.22.22
  pnpm: 10.10.0
Relevant Packages:
  next: 15.3.3 // Latest available version is detected (15.3.3).
  eslint-config-next: 15.3.3
  react: 19.1.0
  react-dom: 19.1.0
  typescript: 5.6.2
Next.js Config:
  output: N/A

Which area(s) are affected? (Select all that apply)

Runtime, Metadata, Loading UI and Streaming, Dynamic Routes, Linking and Navigating

Which stage(s) are affected? (Select all that apply)

next start (local), Other (Deployed)

Additional context

A workaround for now is to set prefetch to false for dynamic routes and then set it to true on onMouseEnter. This will still fetch the metadata, but not for every link on the entire viewport.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Dynamic RoutesRelated to dynamic routes.Linking and NavigatingRelated to Next.js linking (e.g., <Link>) and navigation.Loading UI and StreamingRelated to loading UI (loading.tsx) and streaming.MetadataRelated to Next.js' Metadata API.RuntimeRelated to Node.js or Edge Runtime with Next.js.

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions