Next.js Upgrade Guide Compare Next.js versions and see exactly what changes, what requires action, and what you can start using.
From Next.js 13.0.0 Next.js 14.0.0 Next.js 15.0.0 Next.js 16.0.0 → To Next.js 15.0.0 Next.js 16.0.0
5 Changes
1 Breaking
5 Actions
0 Features
1 Migration tools
Breaking Changes cookies, headers, draftMode, params and searchParams require migration.
import { cookies } from 'next/headers';
type Props = { params: { slug: string } };
export default function Page({ params }: Props) {
const theme = cookies().get('theme')?.value;
return <main data-theme={theme}>{params.slug}</main>;
}import { cookies } from 'next/headers';
type Props = { params: Promise<{ slug: string }> };
export default async function Page({ params }: Props) {
const { slug } = await params;
const store = await cookies();
const theme = store.get('theme')?.value;
return <main data-theme={theme}>{slug}</main>;
} Migration Await request APIs and route props in App Router code. Run npx @next/codemod@latest next-async-request-api . and review its output.
Migration Tools React dependencies and types need coordinated updates.
{
"dependencies": {
"next": "^14.0.0",
"react": "^18.2.0",
"react-dom": "^18.2.0"
}
}{
"dependencies": {
"next": "^15.0.0",
"react": "^19.0.0",
"react-dom": "^19.0.0"
}
} Migration Upgrade react and react-dom together. For TypeScript, update their types and check third-party peer dependencies.
Behavior Changes Server fetch calls no longer opt into caching automatically.
// Next.js 14: cache-eligible server request
const response = await fetch('https://example.com/api/catalog');// Next.js 15: opt in if this catalog should remain cached
const response = await fetch('https://example.com/api/catalog', {
cache: 'force-cache',
}); Migration Use cache: 'force-cache' explicitly where caching is intended; check freshness and SSR performance.
GET responses no longer default to cached output.
// app/api/catalog/route.ts
export async function GET() {
return Response.json({ categories: ['books', 'music'] });
}// Only for public data intended to be statically cached.
export const dynamic = 'force-static';
export async function GET() {
return Response.json({ categories: ['books', 'music'] });
} Migration Opt eligible handlers into static caching with export const dynamic = 'force-static'.
Client navigation changes page cache reuse.
// next.config.mjs
// Next.js 14 page cache defaults
export default {};// Optional: reuse dynamic page segments for 30 seconds.
export default {
experimental: {
staleTimes: { dynamic: 30 },
},
}; Migration Review navigation and staleTimes configuration; test back/forward behavior.