// the find
vercel/next-app-router-playground
A playground to explore Next.js features such as nested layouts, instant loading states, streaming, and component level data fetching.
Vercel's internal DX team playground for testing and documenting Next.js App Router features. It covers layouts, loading states, parallel routes, caching strategies, and view transitions — basically every major App Router concept with a working example. It's useful for developers trying to understand how these features behave before the docs catch up.
The breadth of coverage is the main value — parallel routes, route groups, private/remote caching, and `useLinkStatus` are all demonstrated in context rather than in isolation. The inline `.mdx` readme files per section explain the *why* behind each pattern, which most example repos skip. The repo is actively maintained by the people who write the actual Next.js docs, so the patterns here are the canonical ones. View transitions and app-shell upgrading examples are hard to find elsewhere in a working state.
No tests of any kind — this is purely a visual/interactive demo, so you can't verify behavior programmatically or use it as a reference for testing patterns. The README is two sentences and a pnpm install command; discoverability of what's in here requires poking through the directory tree yourself. Some sections (cached-components, cached-functions, cached-routes) are thin stubs that don't make the distinction between them obvious without reading the Next.js docs alongside. It's also inherently a moving target — tied tightly to Vercel's deployment model, so some caching behavior won't translate to self-hosted Next.js.