最近在出一个前端的体系课程,里面的内容非常详细,如果你感兴趣,可以加我 v 进行联系 yunmz777
:

浪费你几秒钟时间,内容正式开始
Next.js 15.4 于 2025 年 7 月 29 日推出,其中最重要的是 Turbopack 构建命令 next build --turbopack
已通过所有集成测试(超过 8,300 个),标志着 Turbopack 正式迈向稳定阶段并有望成为默认打包工具。
此外,本次版本新增实用功能如 router.prefetch()
失效回调钩子、404 页面全局 metadata 支持等,并修复了一系列稳定性和性能相关问题 。同时,开发者还获得了对即将发布的 Next.js 16 的预览,体验缓存组件统一配置、优化客户端路由、增强调试工具等即将到来的核心功能 。
Turbopack 构建通过 100% 集成测试
Turbopack 是由 Vercel 开发的新一代 JavaScript 和 TypeScript 构建工具,旨在取代传统的 Webpack。它采用 Rust 编写,具有更高的构建速度和更低的资源消耗,特别适合大型项目和高频率迭代的开发流程。Turbopack 支持模块热更新(HMR)更快,响应时间更短,从而提升前端开发效率。它也是 Next.js 官方推荐的未来构建工具。
Next.js 15.4 中使用 next build --turbopack
构建,通过了全部 8,302 项生产环境集成测试(包含各种边界、回归和调试场景),并已经被 Vercel 用于其高流量网站发布,表明 Turbopack 已从实验状态走向稳定、可用于生产环境的构建系统。
新功能 Features
Next.js 15.4 带来了多项实用增强,进一步提升了开发者的使用体验。例如,router.prefetch()
方法新增了 onInvalidate
回调,可以在缓存失效时自动重新提取资源,特别适用于构建自定义导航组件时保持数据的实时同步。

同时,<Link prefetch="auto">
这一语法糖引入,让代码更具可读性,并能继续保有智能预获取行为。
在 SEO 支持方面,官方为 global-not-found.js
文件加入了自定义元数据与结构化数据的导出能力,方便为 404 页面配置更精准的搜索引擎信息。
调试功能也得到增强,next build
命令新增 --debug-prerender
标志,用于开发模式下调试 PPR(部分预渲染)或静态渲染相关的错误,输出更完整的堆栈信息。
此外,开发者现在可以在服务端依赖中使用 htmlrewriter
包进行 HTML 转换,也意味着页面结构控制更灵活。而在渲染策略方面,拦截式动态路由(Intercepted Routes)也加入了对 PPR 的支持,使页面加载表现更加高效。
修复 Fixes
在稳定性和性能层面,Next.js 15.4 同样做了诸多细节优化。
例如,修复了配置对象在复制过程中可能引发的副作用问题,避免因引用关系导致的意外修改。同时,也解决了预取缓存中的一致性问题,确保 staleTime
设置真正生效,并修复了静态页面在过期数据保留方面的 bug。
HTTP 缓存策略也得到了增强,Vary
头的设置现已恢复正常,有助于更精准地进行响应缓存。
此外,React Compiler 的"interestingness"和"usefulness"判定机制得以纠正,提升了编译分析的准确度;launchEditor
功能在处理特定路径格式时的异常也被修复。
最后,对于 Server Actions,官方修正了非 multipart 请求时 bodySizeLimit
的处理逻辑,同时确保无效的操作 ID 会正确返回 404 错误页,提升了开发者调试体验和系统健壮性。
优化 Improvements
本次更新还针对服务器组件(RSC)机制进行了多个关键修正与增强。首先,RSC 请求在发生重定向后将确保查询参数被正确传递,避免跳转中断或数据丢失的问题,同时也为搜索引擎爬虫提供了更优雅的错误回退处理,以维护良好的 SEO 表现。为进一步明确服务器与客户端职责边界,Next.js 15.4 禁止在客户端组件中使用 unstable_rootParams
,防止错误使用内部 API。
此外,RSC 请求现已支持缓存失效参数验证,避免服务端重复处理无效查询,提高性能与准确性。在依赖管理方面,@vercel/og
被更新至 v0.7.2,同时将 assert/strict
标记为外部依赖,以优化构建时的模块打包逻辑。为提升渲染结构的稳定性,流式元数据输出也得到改进,确保其始终处于页面顶层,避免 DOM 混乱;而 FlightRouterState
中的 searchParam
数据则默认被省略,从而减少不必要的重渲染与传输体积。
除了功能增强和修复,Next.js 15.4 在性能层面也有显著提升。静态路径生成(Static Params)过程被优化,参数处理更高效,有助于加快构建速度。React Compiler 方面则改为优先通过 SWC 进行源文件检查,从而进一步加速编译流程。此外,开发者在启用 NEXT_CPU_PROF
环境变量时,CPU 使用情况分析现在也能更精确地反映本地性能瓶颈,为调优提供可靠依据。
哪些情况该升级?如何升级?
对于考虑升级到 Next.js 15.4 的开发者而言,这是一个非常值得把握的版本,尤其适合希望告别 Webpack、追求构建效率与现代开发体验的团队。如果你的项目构建时间较长、本地热重载缓慢,或在 CI/CD 流程中存在构建瓶颈,那么升级后通过 Turbopack 所带来的性能提升会非常可观。
不过在升级前,仍需注意兼容性问题。若项目依赖大量 Webpack 插件或自定义 loader,建议先在功能分支中进行升级测试。同时,请务必清理缓存目录(如 .next/
、.vercel/
),并执行全面的单元与集成测试,确保升级后的运行时行为一致。
你可以通过以下三种方式升级:
- 自动升级 CLI(推荐)
使用官方 codemod 工具进行依赖更新和常见兼容性修复:
bash
npx @next/codemod@canary upgrade latest
- 手动升级依赖
如果你希望手动控制版本更新,可使用以下命令:
bash
npm install next@latest react@latest react-dom@latest
- 初始化新项目
想从零开始体验最新版 Next.js,可以直接初始化新项目:
bash
npx create-next-app@latest
借助 15.4,你不仅能获得更快的构建性能,还能提前感受接近稳定的 Turbopack 所带来的开发革新。
Next.js 16 预览:值得期待的新能力
值得关注的是,Next.js 15.4 也预告了即将在 2025 年夏季 推出的 16 版本中的一系列核心能力,展示了未来演进方向。首先,新的统一缓存机制 cacheComponents
将引入更简洁的 API(如 use cache
、Dynamic IO、PPR 等),帮助开发者以更直观的方式实现性能优化与响应式缓存策略。
与此同时,Turbopack 将正式转入 Beta 通道,迈向成为 Next.js 默认构建工具的重要一步;客户端路由预取逻辑也将更加智能,支持自动 invalidation 判断,从而减少带宽浪费并加速导航体验。调试工具方面,Next.js DevTools 也将获得重大升级,包括路由结构可视化、组件状态调试、浏览器控制台日志转发,甚至加入 AI 辅助调试能力。
此外,原本为实验特性的 Node.js middleware 将在 v16 中正式稳定,开发者可以放心地在生产环境中使用。同时,Next.js 还计划推出"部署适配器(Deployment Adapters)" alpha 版,支持更灵活的部署目标与平台适配。随着演进,旧版本兼容内容也会被清理:v16 将弃用 Node.js 18、AMP 相关功能,以及对 Next.js Image API 做出调整,官方也会提供相应的迁移指南。
如果你希望提前体验这些即将到来的功能,可以将项目依赖切换到 next@canary
,并在 next.config.js
中启用相关实验性选项,例如:
js
// next.config.js
module.exports = {
experimental: {
dynamicIO: true,
turbopackPersistentCaching: true,
},
};
通过这些设置,开发者可以抢先感受 Next.js 下一代架构与能力布局,为未来升级做好准备。
总结
Next.js 15.4 不仅在 Turbopack 的构建稳定性和性能表现上取得重要突破,同时也带来了大量聚焦开发体验的语法与平台细节优化。这个版本标志着 Next.js 正稳步推进 Vercel 路线图中关于模块化、高性能、现代化全栈框架的长期愿景,并为即将到来的 v16 奠定了坚实的技术基础。对于曾因 Turbopack 稳定性而持观望态度的团队来说,15.4 是一个值得深入试用的关键版本。