nextjs - 💡(How to fix) Fix prefetch causes incorrect cache tags to be applied (breaks revalidation) [3 comments, 3 participants]

Official PRs (…)
ON THIS PAGE

Recommended Tools

×6

Utilities matched from this issue’s tags and category — try them while you read without losing context.

GitHub issue graph ai analysis

Paste a GitHub issue URL. We fetch that issue, discover linked issues from bodies/comments/timeline, collect linked pull requests, and produce a structured English report.

The report is written in English Markdown for sharing and archival.

Helpful · Quick feedback

Loading…
GitHub stats
vercel/next.js#90376Fetched 2026-04-08 00:20:20
View on GitHub
Comments
3
Participants
3
Timeline
9
Reactions
0
Author
Timeline (top)
commented ×3closed ×1issue_type_added ×1labeled ×1

Root Cause

  1. Build and run the application in production mode:
npm run build
npm run start
  1. Open the homepage (/).
  • This fetches data, creates cache tags for the homepage path, prefetches the /business route and creates tags for the business path.
  1. Inspect the path cache tags for both routes:
  • The homepage path contains the correct tags (business, etc.).
  • The prefetched /business path has incorrect tags.
  1. Attempt revalidation using the tags:
  • Trigger revalidateTag('business') or a similar cache invalidation.
  • /business does not update because the prefetched path is missing the correct tag.

Code Example

npm run build
npm run start

---

Operating System:
  Platform: linux
  Arch: x64
  Version: #1 SMP PREEMPT_DYNAMIC Sun Aug  6 20:05:33 UTC 2023
  Available memory (MB): 4102
  Available CPU cores: 2
Binaries:
  Node: 20.12.1
  npm: 10.5.0
  Yarn: 1.22.19
  pnpm: 8.15.6
Relevant Packages:
  next: 16.1.6 // Latest available version is detected (16.1.6).
  eslint-config-next: N/A
  react: 19.2.4
  react-dom: 19.2.4
  typescript: 5.9.3
Next.js Config:
  output: N/A
RAW_BUFFERClick to expand / collapse

Link to the code that reproduces this issue

https://codesandbox.io/p/devbox/strange-james-9ttn2r?workspaceId=ws_W3Dk5bxF2Lw4qXT6z5Y4h1

To Reproduce

  1. Build and run the application in production mode:
npm run build
npm run start
  1. Open the homepage (/).
  • This fetches data, creates cache tags for the homepage path, prefetches the /business route and creates tags for the business path.
  1. Inspect the path cache tags for both routes:
  • The homepage path contains the correct tags (business, etc.).
  • The prefetched /business path has incorrect tags.
  1. Attempt revalidation using the tags:
  • Trigger revalidateTag('business') or a similar cache invalidation.
  • /business does not update because the prefetched path is missing the correct tag.

Current vs. Expected behavior

Current Behavior

  • When the homepage (/) is loaded in production, it fetches data and correctly creates cache tags for the homepage.

  • The homepage prefetches the /business route, but the prefetched route does not receive the correct tags.

  • Inspecting the cache shows:

    <img width="788" height="124" alt="Image" src="https://github.com/user-attachments/assets/4e25c9c0-d5dc-4074-aa97-44360283e835" />
  • Attempting to revalidate using revalidateTag('business') does not update /business, because the route is missing the required tag.

Expected Behavior

  • Prefetched routes should inherit or maintain correct cache tags associated with their data.

  • /business should have the same business tag as the homepage, so that triggering: revalidateTag('business') updates both pages.

  • Inspecting the cache would show:

    <img width="788" height="135" alt="Image" src="https://github.com/user-attachments/assets/2b7f742e-3fb8-42d1-83ad-27db144e3f52" />
  • After revalidation, /business should serve fresh content, reflecting the latest updates.

Provide environment information

Operating System:
  Platform: linux
  Arch: x64
  Version: #1 SMP PREEMPT_DYNAMIC Sun Aug  6 20:05:33 UTC 2023
  Available memory (MB): 4102
  Available CPU cores: 2
Binaries:
  Node: 20.12.1
  npm: 10.5.0
  Yarn: 1.22.19
  pnpm: 8.15.6
Relevant Packages:
  next: 16.1.6 // Latest available version is detected (16.1.6).
  eslint-config-next: N/A
  react: 19.2.4
  react-dom: 19.2.4
  typescript: 5.9.3
Next.js Config:
  output: N/A

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

Use Cache

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

Other (Deployed), next start (local), next build (local)

Additional context

No response

extent analysis

Fix Plan

Step 1: Identify the Issue

The issue is caused by the prefetched route not inheriting the correct cache tags associated with its data.

Step 2: Update getStaticProps to Include Cache Tags

In the getStaticProps function of the /business page, update the revalidate and tags properties to include the business tag.

import { GetStaticProps } from 'next';

const BusinessPage = () => {
  // ...
};

export const getStaticProps: GetStaticProps = async () => {
  const data = await fetchData(); // Assume fetchData is a function that fetches data
  const tags = ['business']; // Include the business tag

  return {
    revalidate: 60, // Revalidate every 1 minute
    tags,
  };
};

Step 3: Update getStaticPaths to Include Cache Tags

In the getStaticPaths function, update the tags property to include the business tag.

import { GetStaticPaths } from 'next';

const BusinessPage = () => {
  // ...
};

export const getStaticPaths: GetStaticPaths = async () => {
  const paths = await getPaths(); // Assume getPaths is a function that fetches paths

  return {
    paths,
    tags: ['business'], // Include the business tag
  };
};

Step 4: Verify the Fix

After updating the getStaticProps and getStaticPaths functions, verify that the /business page is revalidating correctly when the revalidateTag('business') function is called.

import { revalidateTag } from 'next/cache';

// Call revalidateTag('business') to revalidate the /business page
revalidateTag('business');

Verification

To verify that the fix worked, check that

Vote matrix · Quick signals

Works
Did the solution work? Tap to confirm.
Easy Fix
Was it a quick fix?
Time Saver
Did it save you time?
Blocking
Was it severely blocking?
Common Issue
Are others likely hitting this too?
Flaky / Intermittent
Is it intermittent?
Verified / Reproducible
Can you reproduce it reliably?
Loading…

Still need to ship something?

×6

Another batch ranked right after the header list — different links, same matching logic.

Back to top recommendations

TRENDING

nextjs - 💡(How to fix) Fix prefetch causes incorrect cache tags to be applied (breaks revalidation) [3 comments, 3 participants]