Next.js 16 上线，有人 3 天升级成功，也有人生产环境翻车

Vercel 旗下的 React 框架 Next.js 近日发布了 Next.js 16。这一版本带来了多项架构层面的改进与性能优化，同时也对缓存机制进行了根本性的调整。

Next.js 16 引入了多项新特性，包括需要显式开启的 Cache Components、通过 Model Context Protocol 集成的 AI 辅助调试能力，以及作为默认构建工具正式转正的 Turbopack。此外，新版本还对路由系统进行了增强，加入了布局去重（layout deduplication）和增量式预取（incremental prefetching），以加快页面跳转速度。

其中，Cache Components 是 Next.js 16 最关键的变化之一。这一特性彻底告别了 App Router 以往版本中“隐式缓存”的行为，引入了全新的 use cache 指令，开发者可以用它来缓存页面、组件以及函数，并由编译器自动生成缓存键。与此前缓存行为可能难以预测不同，现在所有动态代码默认都会在请求时执行，更符合开发者对全栈应用框架的直觉预期。Cache Components 也补全了 Partial Pre-Rendering 的整体设计思路。缓存组件完善了 2023 年首次推出的部分预渲染（Partial Pre-Rendering）功能，使开发者能够在静态页面中选择性启用部分动态渲染内容，同时不牺牲初始加载速度。

Turbopack 在这一版本中正式达到稳定状态，并成为所有新建 Next.js 项目的默认打包工具。自 Beta 版发布以来，其采用率迅速增长，目前已有超过 50% 的开发会话运行在 Turbopack 之上。官方数据显示，开发者可体验到最高 10 倍的快速刷新（Fast Refresh）速度提升，以及 2-5 倍的生产构建加速。对于仍依赖自定义 webpack 配置的应用，开发者仍可通过运行 next dev --webpack 或 next build --webpack 继续使用 webpack。

在路由与导航系统方面，Next.js 16 也进行了更新。布局去重机制确保在预取多个共享同一布局的 URL 时，布局资源只会被下载一次，而不是为每个链接分别下载，从而减少不必要的网络开销。

开发者 Phil Collins 在评价这一版本时表示，这次发布更像是一次“基础性升级”，不只是修修补补，而是让人能够重新思考应用架构本身。

不过，该版本发布并非毫无问题。有开发者反馈“Next.js 16 导致我们的生产环境崩溃”，尤其是在使用 Node.js 作为中间件运行时遇到了一些挑战。在 Reddit 上，也有开发者发帖讨论升级到 16 版本的实际体验。一位开发者分享称，他将一个单体、多租户的 NextJS 14 应用升级到 NextJS 16，并提到“相较于 Next.js 14，编译速度极快，整个升级过程耗时约 3 天。另一位评论者也表示，借助代码转换工具（codemods），一个大型应用在数周内完成平滑上线，整体过程相当顺利。

需要注意的是，升级到 Next.js 16 涉及多项重大变更。开发者可以使用自动升级 CLI，通过命令px @next/codemod@canary upgrade latest进行升级，也可以选择手动执行 npm install next@latest react@latest react-dom@latest。

这些重大变更包括：Node.js 最低版本要求提升至 20.9.0；params 和 searchParams 现在必须以 async 形式使用；middleware.ts 被替换为 proxy.ts，以明确网络边界；revalidateTag() API 在使用过期-重新验证（stale-while-revalidate） 行为时，需要将 cacheLife 配置作为第二个参数传入。更完整的迁移说明可参考官方升级文档。

Next.js 是由 Vercel 开发维护的开源框架，基于 React 构建，新增了服务端渲染、静态站点生成和高级路由功能，助力开发者更轻松地构建性能优异的生产级应用。该框架在 Web 开发生态中应用广泛，得到部署平台和托管服务商的原生支持。

原文链接：

https://www.infoq.com/news/2025/12/nextjs-16-release/