fix navigation applying stale data when triggered from global not found

[ztanner]

What

When a global not found page is rendered, and when the not-found page or containing layout has a link with prefetch: auto back to the root page, the router would update the URL but not correctly swap out the not-found component with the page component.

Why

With auto prefetching (which is the default when prefetch is left unspecified on a link), the router will perform a partial prefetch on dynamic pages. This means it'll fetch the flight data without React nodes and store it in the prefetch cache. On navigation, this is used to determine where we already have cached React nodes and where we need to trigger a lazy fetch to get new data. However, global not found pages are peculiar in that they will always contain a data path like: ['', { children: ['__PAGE__', {}] }] since they are inserted at the root. This means that if there's also a page component that corresponds with the same path, the router will incorrectly think it already has cache node data for it.

How

During SSR when the asNotFound flag signals to the renderer that the component we're rendering is matching the global not-found page, we modify the segment key to be something unique so the data path won't collide with a top-level page.

In fc01c8e I added handling only on the server to modify the segment key. This still fixes the issue, but at the cost of triggering an MPA navigation on the client because it's treated as a root layout change

In 69d5687 I added client handling to not treat this special segment key as a root layout change, and to signal to the router it needs to refetch the data. This ensures we don't do an MPA navigation.

Fixes #61956
Closes NEXT-2481

[ztanner]

• canary
  • fix navigation applying stale data when triggered from global not found #62033 👈

This stack of pull requests is managed by Graphite. Learn more about stacking.

Join @ztanner and the rest of your teammates on Graphite

[ijjk]

Stats from current PR

Default Build (Increase detected ⚠️)

General Overall increase ⚠️

	vercel/next.js canary	vercel/next.js 02-13-fix_navigation_applying_stale_data_when_triggered_from_global_not_found	Change
buildDuration	19s	19s	N/A
buildDurationCached	7s	6.1s	N/A
nodeModulesSize	196 MB	196 MB	⚠️ +21.2 kB
nextStartRea..uration (ms)	422ms	427ms	N/A

Client Bundles (main, webpack)

	vercel/next.js canary	vercel/next.js 02-13-fix_navigation_applying_stale_data_when_triggered_from_global_not_found	Change
1068-HASH.js gzip	30 kB	30 kB	N/A
3f784ff6-HASH.js gzip	53.5 kB	53.5 kB	N/A
4944-HASH.js gzip	4.96 kB	4.96 kB	N/A
8423.HASH.js gzip	181 B	181 B	✓
framework-HASH.js gzip	45.2 kB	45.2 kB	✓
main-app-HASH.js gzip	242 B	243 B	N/A
main-HASH.js gzip	32 kB	32.1 kB	N/A
webpack-HASH.js gzip	1.7 kB	1.7 kB	✓
Overall change	47.1 kB	47.1 kB	✓

Legacy Client Bundles (polyfills)

	vercel/next.js canary	vercel/next.js 02-13-fix_navigation_applying_stale_data_when_triggered_from_global_not_found	Change
polyfills-HASH.js gzip	31 kB	31 kB	✓
Overall change	31 kB	31 kB	✓

Client Pages

	vercel/next.js canary	vercel/next.js 02-13-fix_navigation_applying_stale_data_when_triggered_from_global_not_found	Change
_app-HASH.js gzip	196 B	196 B	✓
_error-HASH.js gzip	184 B	183 B	N/A
amp-HASH.js gzip	503 B	504 B	N/A
css-HASH.js gzip	323 B	324 B	N/A
dynamic-HASH.js gzip	2.5 kB	2.51 kB	N/A
edge-ssr-HASH.js gzip	258 B	259 B	N/A
head-HASH.js gzip	353 B	351 B	N/A
hooks-HASH.js gzip	370 B	370 B	✓
image-HASH.js gzip	4.21 kB	4.2 kB	N/A
index-HASH.js gzip	259 B	259 B	✓
link-HASH.js gzip	2.68 kB	2.67 kB	N/A
routerDirect..HASH.js gzip	313 B	314 B	N/A
script-HASH.js gzip	386 B	385 B	N/A
withRouter-HASH.js gzip	309 B	311 B	N/A
1afbb74e6ecf..834.css gzip	106 B	106 B	✓
Overall change	931 B	931 B	✓

Client Build Manifests

	vercel/next.js canary	vercel/next.js 02-13-fix_navigation_applying_stale_data_when_triggered_from_global_not_found	Change
_buildManifest.js gzip	485 B	484 B	N/A
Overall change	0 B	0 B	✓

Rendered Page Sizes

	vercel/next.js canary	vercel/next.js 02-13-fix_navigation_applying_stale_data_when_triggered_from_global_not_found	Change
index.html gzip	529 B	527 B	N/A
link.html gzip	541 B	540 B	N/A
withRouter.html gzip	525 B	522 B	N/A
Overall change	0 B	0 B	✓

Edge SSR bundle Size

	vercel/next.js canary	vercel/next.js 02-13-fix_navigation_applying_stale_data_when_triggered_from_global_not_found	Change
edge-ssr.js gzip	94.4 kB	94.4 kB	N/A
page.js gzip	151 kB	151 kB	N/A
Overall change	0 B	0 B	✓

Middleware size

	vercel/next.js canary	vercel/next.js 02-13-fix_navigation_applying_stale_data_when_triggered_from_global_not_found	Change
middleware-b..fest.js gzip	627 B	626 B	N/A
middleware-r..fest.js gzip	151 B	151 B	✓
middleware.js gzip	44.4 kB	44.4 kB	N/A
edge-runtime..pack.js gzip	1.94 kB	1.94 kB	✓
Overall change	2.1 kB	2.1 kB	✓

Next Runtimes

	vercel/next.js canary	vercel/next.js 02-13-fix_navigation_applying_stale_data_when_triggered_from_global_not_found	Change
app-page-exp...dev.js gzip	166 kB	166 kB	N/A
app-page-exp..prod.js gzip	95.5 kB	95.5 kB	N/A
app-page-tur..prod.js gzip	97.2 kB	97.3 kB	N/A
app-page-tur..prod.js gzip	91.7 kB	91.7 kB	N/A
app-page.run...dev.js gzip	136 kB	136 kB	N/A
app-page.run..prod.js gzip	90.2 kB	90.3 kB	N/A
app-route-ex...dev.js gzip	22 kB	22 kB	✓
app-route-ex..prod.js gzip	14.9 kB	14.9 kB	✓
app-route-tu..prod.js gzip	14.9 kB	14.9 kB	✓
app-route-tu..prod.js gzip	14.6 kB	14.6 kB	✓
app-route.ru...dev.js gzip	21.7 kB	21.7 kB	✓
app-route.ru..prod.js gzip	14.6 kB	14.6 kB	✓
pages-api-tu..prod.js gzip	9.43 kB	9.43 kB	✓
pages-api.ru...dev.js gzip	9.7 kB	9.7 kB	✓
pages-api.ru..prod.js gzip	9.43 kB	9.43 kB	✓
pages-turbo...prod.js gzip	22.1 kB	22.1 kB	✓
pages.runtim...dev.js gzip	22.7 kB	22.7 kB	✓
pages.runtim..prod.js gzip	22.1 kB	22.1 kB	✓
server.runti..prod.js gzip	49.9 kB	49.9 kB	✓
Overall change	248 kB	248 kB	✓

build cache Overall increase ⚠️

	vercel/next.js canary	vercel/next.js 02-13-fix_navigation_applying_stale_data_when_triggered_from_global_not_found	Change
0.pack gzip	1.55 MB	1.55 MB	N/A
index.pack gzip	103 kB	103 kB	⚠️ +117 B
Overall change	103 kB	103 kB	⚠️ +117 B

Diff details

Diff for page.js

Diff too large to display

Diff for edge-ssr.js

Diff too large to display

Diff for 1068-HASH.js

Diff too large to display

Diff for main-HASH.js

Diff too large to display

Diff for app-page-exp..ntime.dev.js

Diff too large to display

Diff for app-page-exp..time.prod.js

Diff too large to display

Diff for app-page-tur..time.prod.js

Diff too large to display

Diff for app-page-tur..time.prod.js

Diff too large to display

Diff for app-page.runtime.dev.js

Diff too large to display

Diff for app-page.runtime.prod.js

Diff too large to display

Commit: a547b3a

[ijjk]

Tests Passed