Next.js 15 (released October 2024) and React 19 (stable December 2024) represent the most significant changes to the React ecosystem in several years. The changes affect how you think about rendering, data fetching, and form handling — not just the APIs. Here is what matters and why.
React 19 Core Changes
React Actions: the most important new primitive. A “action” is an async function that can be passed to a form’s `action` prop or called from event handlers. React handles loading states, error handling, and optimistic updates automatically when you use them correctly. Form handling before React 19: every form needed manual state management (`useState` for fields, `useState` for loading, `useState` for errors, `useEffect` for side effects). React 19: `
` — React automatically tracks the pending state and the form resets on success. The `useActionState` hook: `const [state, dispatch, isPending] = useActionState(action, initialState)` — manages server action state, pending state, and error state together. The `useOptimistic` hook: update the UI immediately before the server confirms, then reconcile with the server response. The most useful hook for comment/like/follow interactions where immediate feedback matters. Server Components: now stable (they existed as experimental in Next.js 13/14). A Server Component renders entirely on the server — it can directly access databases, file systems, and secrets without exposing them to the client. No `useState`, no `useEffect`, no client-side JavaScript at all. The fundamental mental model shift: in the old React, everything was a client component by default and you opted into server rendering (SSR). In the new React/Next.js model, components are server components by default and you opt into client behaviour with `’use client’` at the top of the file. The `use` hook: `const data = use(promise)` — works in both client and server components to unwrap promises and React Context. Particularly useful for reading context in server components.
Next.js 15 Changes
Async request APIs: `cookies()`, `headers()`, `params`, and `searchParams` are now all async — you must `await` them. This is a breaking change from Next.js 14. The codemod handles most cases: `npx @next/codemod@latest next-async-request-api .`. Why: moving to async makes these APIs composable with React’s Suspense model. Turbopack for development (stable): Next.js 15 ships with Turbopack as the default dev bundler (you can still use Webpack but the default is now Turbopack). Claims: 76.7% faster initial compilation, 96.3% faster HMR (hot module replacement). In practice: significantly faster cold starts and faster page refreshes. React 19 required: Next.js 15 requires React 19. This means the new hooks and server actions are available but also means the breaking changes in React 19 apply. The `Form` component: Next.js 15 ships a `
