By implementing some dynamic route in our nextjs app dir application, we noticed random very slow TTFB on Vercel. By digging further, when the revalidation time of a fetch is reached, the page rendering will be blocked until the fetch cache is populated again (should be stale while revalidate).
To test it, I'm fetching a test route which delays the returned value by 3 seconds. revalidate is set to 10 sec, runtime to edge.
Refreshing for the next 10 sec (revalidation duration) will be fast (< 100ms)
Refreshing 10 sec+ after will take 3+ seconds. Fetch cache won't be served while revalidate.
Some additional confusing data:
Fetching takes less then 10ms even when the page rendering is blocked during revalidation, meaning the cache seems to be properly returned.
Expected Behavior
The fetch response should be returned as stale while revalidate and page rendering should be blocked only if cache has never been populated.
Which browser are you using? (if relevant)
No response
How are you deploying your application? (if relevant)
Verify canary release
Provide environment information
Which area(s) of Next.js are affected? (leave empty if unsure)
App Router
Link to the code that reproduces this issue or a replay of the bug
https://github.com/mrgnou/nextjs-issue-fetch-cache
To Reproduce
By implementing some dynamic route in our nextjs app dir application, we noticed random very slow TTFB on Vercel. By digging further, when the revalidation time of a fetch is reached, the page rendering will be blocked until the fetch cache is populated again (should be stale while revalidate).
To test it, I'm fetching a test route which delays the returned value by 3 seconds.
revalidate
is set to 10 sec,runtime
to edge.page.js
api/date/route.js
Describe the Bug
Some additional confusing data: Fetching takes less then 10ms even when the page rendering is blocked during revalidation, meaning the cache seems to be properly returned.
Expected Behavior
The fetch response should be returned as stale while revalidate and page rendering should be blocked only if cache has never been populated.
Which browser are you using? (if relevant)
No response
How are you deploying your application? (if relevant)
Vercel