OpenAINext.jsOct 21, 2024, 5:00 PM

Next.js 15

A condensed section focused on the key takeaways first.

Original Post

Quick Digest

Summary

A condensed section focused on the key takeaways first.

openaienmodel: gpt-5-mini-2025-08-07

Next.js 15 — Stable release with breaking async APIs and caching changes

Key Points

  • Async Request APIs — breaking
  • GET Route Handlers uncached by default
  • React 19 support (RC)

Summary

Next.js 15 is stable and production-ready. The release focuses on stability, performance, and major platform changes: async request APIs (breaking), new caching semantics (breaking for GET route handlers and client router cache), React 19 support (RC), tooling improvements (codemod CLI, Turbopack stable), and several developer experience updates (improved hydration errors, static route indicator, instrumentation API, and experimental React Compiler).

Key Points

  • Upgrade tools: use the new codemod CLI to smooth upgrades: npx @next/codemod@canary upgrade latest. You can also update packages manually with npm install next@latest react@rc react-dom@rc.
  • Breaking changes (migrate ASAP):
    • Async Request APIs: APIs that access request-specific data (cookies, headers, draftMode, params in layouts/pages/routes/defaults, generateMetadata, generateViewport, and searchParams in pages) are becoming async. A codemod npx @next/codemod@canary next-async-request-api is available; synchronous access will warn until the next major.
    • Caching semantics: GET Route Handlers are uncached by default and the Client Router Cache uses a staleTime of 0 for Page segments. Opt back in with route config (e.g. export const dynamic = 'force-static') or the experimental staleTimes config in next.config.ts.
  • React and compiler:
    • App Router runs on React 19 RC; Pages Router remains compatible with React 18 to ease migration. Running both React versions in one app is not recommended.
    • Experimental React Compiler support is available (Babel plugin for now).
  • Dev tooling and performance:
    • Turbopack Dev (next dev --turbo) is stable with large gains in startup and Fast Refresh times.
    • Improved hydration error UI shows source and suggestions to debug faster.
    • Static Route Indicator in dev highlights static vs dynamic routes to aid optimization.
  • New / improved APIs and platform features:
    • Experimental unstable_after allows scheduling work after a response finishes streaming (enable via experimental.after in next.config.ts).
    • instrumentation.js API is stable for server lifecycle observability.
    • Enhanced forms (next/form), TypeScript support for next.config.ts, bundling external packages config (stable), ESLint 9 support, server-action security improvements, and additional self-hosting Cache-Control controls.

Migration checklist (practical steps)

  • Run the codemod CLI: npx @next/codemod@canary upgrade latest and npx @next/codemod@canary next-async-request-api.
  • Audit usages of cookies, headers, params, searchParams, and draftMode and convert to async patterns where required.
  • Determine caching needs: opt into static caching with export const dynamic = 'force-static' for route handlers or configure experimental.staleTimes in next.config.ts.
  • Test with Turbopack Dev for faster iteration; keep an eye on React version alignment between App and Pages Routers.
  • Read the upgrade guides for Next.js 15 and React 19 for detailed steps and edge cases.

For engineers: focus on the async request API migration and caching opt-ins first, use the codemod to automate most changes, and verify CI/local test suites under the new defaults.

Full Translation

Translations

A translation section that keeps the flow of the original article.

openaijamodel: gpt-5-mini-2025-08-07

Next.js 15

Next.js 15 の主な変更点

Next.js 15 は以下を導入しています。

主なポイント

  • React 19 のサポート
    • Next.js 15 は React 19 をサポートします。既存のアプリは互換性を確認の上でアップグレードしてください。
  • キャッシュの改善
    • ビルドおよびランタイムキャッシュの改善により、パフォーマンスとビルド時間の改善が期待できます。
  • Turbopack の開発モードでの安定リリース
    • Turbopack が development(開発モード)で安定版として提供されます。開発環境での高速なバンドリングを利用できます。
  • 新しい API
    • 開発者向けの新しい API が追加され、拡張性とカスタマイズが向上します。
  • その他
    • 小さな改善やバグ修正も含まれています。

詳細は公式リリースノートやドキュメントをご確認ください。