Next.js 16.3 introduces instant page navigations for dynamic apps using runtime partial prerendering and browser-side caching, without requiring client-side data fetching. The Vercel team applied this to v0 using an AI coding agent loop: the agent wrote failing Playwright tests using a new `instant()` test helper, applied code fixes (primarily moving dynamic data fetches behind Suspense boundaries), and iterated until tests passed. The result was 16 new regression tests and instant navigations across v0's homepage, chat, and settings pages. The `next-cache-components-optimizer` Skill is available for others to run the same process on their own apps.
Table of contents
Prerendering for dynamic appsUsing loops to make v0 instantA test for "fast"Running the loop on v0Fast, foreverTry it yourselfWhy frameworks matter in the era of agentsFeedback and CommunityQuestions this post answers
How does Next.js 16.3 enable instant navigations for dynamic apps without moving data fetching to the client?
Next.js 16.3 lets dynamic apps partially prerender pages at runtime while users browse, caching that content entirely in the browser. Components can define a loading state with Suspense or mark UI as prerenderable with `'use cache'`. Next.js extracts this UI and loads it into the client before a navigation, without fully rendering the target page or requiring static content. Developers shipping dynamic Next.js apps track these navigation patterns on daily.dev.
How do I write a Playwright test that asserts a Next.js navigation is instant?
Next.js 16.3 ships an `instant()` helper from `@next/playwright`. Wrap the navigation action and visibility assertion inside `await instant(page, async () => { ... })`. If the expected UI element was blocked by a network request rather than available immediately from the browser cache, the test fails. This makes 'instant navigation' a deterministic, automatable assertion. Teams adopting Next.js 16.3 testing patterns share results on daily.dev.
What code change is typically needed to unblock a slow Next.js navigation caused by blocking data fetches in a page component?
Move the async data fetching out of the page component and into a child component wrapped in a Suspense boundary. The page component becomes synchronous and returns a layout shell immediately, while the dynamic data loads inside the Suspense child. This allows Next.js to include the shell in the prerendered content and show it instantly on navigation. Engineers refactoring Next.js pages for instant navigations find related patterns on daily.dev.