Next.js playground

Demos of newer Next.js APIs

Cache Explorer

Next 16 makes caching opt-in: add "use cache" where you want it. Here it is wired to tags and the invalidate buttons below.

"use cache"cacheTag()cacheLife()revalidateTag()updateTag()io()
Open playground →

View Transitions

Route-level transitions without an extra library. Jump between the grid and detail pages to see shared elements and transitionTypes.

<ViewTransition>transitionTypesview-transition-name::view-transition-old/new
Open playground →

Prefetch Stages

Partial Prefetching loads a route in three stages. Compare Shell only vs Warm prefetch and watch which panels resolve before the click.

prefetch()navigation()prefetch={true}partialPrefetching<Suspense>
Open playground →

Offline Resilience

Experimental connectivity detection: soft-nav into a prefetched shell while offline, then watch metrics and Server Actions retry on reconnect.

experimental.useOfflineuseOffline()Server ActionsApp Shell
Open playground →

Resources: Next.js 16.4 release notes · navigation() docs · offline support guide · viewTransition docs