Next.js 16 上線，有人 3 天升級成功，也有人生產環境翻車

作者 | Daniel Curtis

譯者 | 田橙

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/

聲明：本文為 InfoQ 翻譯，未經許可禁止轉載。