archive/rsnext
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

app-router: tweak prefetch cache status heuristics (#53864)

Browse source 
This PR changes the heuristic in the client cache to only check and show the prefetched data when it was prefetched or last read 30s ago vs keeping it around as long as it was accessed within 30s.
This commit is contained in:
Jimmy Lai 2023-08-20 13:25:48 +02:00 committed by GitHub
parent 86fc1697d5
commit 6aa07fb999
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 19 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
packages/next/src/client/components/router-reducer/reducers/navigate-reducer.ts
View file

@ -251,8 +251,11 @@ export function navigateReducer(
// Unwrap cache data with `use` to suspend here (in the reducer) until the fetch resolves.
const [flightData, canonicalUrlOverride] = readRecordValue(data!)
// important: we should only mark the cache node as dirty after we unsuspend from the call above
prefetchValues.lastUsedTime = Date.now()
// we only want to mark this once
if (!prefetchValues.lastUsedTime) {
// important: we should only mark the cache node as dirty after we unsuspend from the call above
prefetchValues.lastUsedTime = Date.now()
}
// Handle case when navigating to page in `pages` from `app`
if (typeof flightData === 'string') {

16
test/e2e/app-dir/app-client-cache/client-cache.test.ts
View file

@ -304,7 +304,7 @@ createNextDescribe(
expect(number).toBe(randomNumber)
await browser.eval(fastForwardTo, 30 * 1000)
await browser.eval(fastForwardTo, 5 * 1000)
await browser.elementByCss('[href="/"]').click()
@ -314,7 +314,19 @@ createNextDescribe(
.waitForElementByCss('#random-number')
.text()
expect(newNumber).not.toBe(randomNumber)
expect(newNumber).toBe(randomNumber)
await browser.eval(fastForwardTo, 30 * 1000)
await browser.elementByCss('[href="/"]').click()
const newNumber2 = await browser
.elementByCss('[href="/1"]')
.click()
.waitForElementByCss('#random-number')
.text()
expect(newNumber2).not.toBe(newNumber)
})
it('should refetch below the fold after 30 seconds', async () => {
const randomLoadingNumber = await browser