App Router 代表著 Next.js 未來的全新基礎，但我們也意識到仍有改進空間。我們想分享目前的工作重點。
在接下來的 Next.js 版本中，我們將專注於以下領域：
- 提升效能
- 提升穩定性
- 加強開發者教育
App Router
首先，有必要說明 App Router 的設計背景。
透過與 React 對齊來超越 Pages Router
隨著 Next.js 的採用率提升和大型應用程式的開發，我們從社群獲得反饋，並發現 Pages Router 已開始面臨限制。
最值得注意的是，Next.js Pages Router 並非為串流設計，而串流是現代 React 的核心基礎，能幫助我們解決面臨的限制並實現 Next.js 的長期願景。
為了建立支援串流的框架 API（用於資料獲取、資源載入和頁面元數據），以及利用 React 的新基礎功能，我們需要對 Next.js 的核心架構進行重大變更。
我們把握機會基於 React 的最新並行功能（如伺服器元件 (Server Components)、Suspense 等）進行建構，這些功能是專為串流架構設計的。
漸進式採用是不可妥協的
我們不希望社群為了升級到最新版 Next.js 而必須從頭重建整個應用程式。我們相信漸進式採用是應用程式長期演進的最佳策略。
- 逐路由漸進遷移：無需大規模重寫應用程式，您可以逐步將單一路由遷移至 App Router，按自己的步調開始使用新功能。請參閱我們的漸進式採用指南或觀看教學影片。
- 輕鬆回退：如果您對 App Router 的效能或開發體驗不滿意，可以輕鬆回退到 Pages Router（僅針對特定路由）。
我們正在探索更多讓漸進式採用更簡單的機會。
邁向穩定之路
我們從一年多前開始建構 Next.js App Router，並持續發布新功能和改進。
- 首次公告：同年五月，我們發布了 RFC 來概述讓路由和佈局更靈活的計劃。
- 早期測試版：在 Next.js 13 中，我們發布了 App Router 的第一個版本，讓社群試用並提供早期反饋。
- 穩定 API：根據反饋，我們集中精力完成核心 API。在 13.4 版本中，我們將 App Router 的核心 API 標記為穩定，準備好迎接更廣泛的採用。
我們目前的重點
標記穩定向社群傳達了核心 API 已確定，不會再有需要重寫的重大破壞性變更。
自此之後，我們收到了大量寶貴反饋，而增加的採用率也無可避免地揭露了錯誤和進一步改進的機會。
我們想讓您知道，我們對目前使用 App Router 的體驗還不滿意，這是我們未來工作的首要任務。因此，讓我們談談我們正在進行的改進工作。
提升效能
在接下來的幾個月，我們將專注於三個效能面向：本地迭代速度、生產建置時間和無伺服器效能。
本地開發效能
隨著 Next.js 的成熟和應用程式規模的增長，我們逐步替換其底層架構，採用更快、更具擴展性的工具。
-
遷移進度：我們從用 SWC 取代 Babel（編譯）和 Terser（最小化）開始，這有助於提升本地迭代速度和生產建置時間。
-
長期投資：為了保持優秀的 Fast Refresh 效能（無論應用程式大小），意味著 Next.js 在本地開發時需盡可能增量運作，僅在需要時打包和編譯程式碼。
這就是我們目前用 Turbopack 取代 webpack（打包）的原因。Turbopack 基於低階增量計算引擎建構，能快取到單一函數層級。
轉用 Turbopack 的 Next.js 應用程式將在規模增長時仍保持 Fast Refresh 速度的持續提升。
過去幾個月，Turbo 團隊專注於提升 Turbopack 的效能和對所有 Next.js 功能及 App Router API 的支援。
Turbopack 目前處於測試版（
next dev --turbo）。 -
改進現有架構：除了投資未來，我們也持續對現有的 webpack 架構進行效能改進。
對於某些 Next.js 應用程式（特別是那些需要重新整理數千個模組的應用），我們收到本地開發和 Fast Refresh 不穩定的報告。我們正在努力提升這方面的效能和可靠性。例如，我們最近新增了預設設定（
modularizeImports）來處理大型圖標庫，這些庫可能意外導致數千個模組在每次請求時重新載入。
建置時間效能
我們也在開發 Turbopack 的生產建置功能（next build --turbo），並已開始提交這項工作的第一部分。請在接下來的版本中期待更多更新。
生產環境效能
最後，在 Vercel 上，我們正在優化 透過 Next.js 應用程式程式碼定義 的 Vercel Functions 的效能和記憶體使用，確保最小的冷啟動時間，同時保留可擴展的無伺服器架構優勢。這項工作已為 Next.js 帶來新的追蹤功能（實驗性），並開始探索伺服器端開發者工具。
提升穩定性
Pages Router 已存在六年。App Router 的發布意味著引入了新的 API，這些 API 僅經過六個月的使用，仍處於早期階段。我們在短時間內取得了長足進步，但隨著從社群和他們的使用方式中學習，仍有改進空間。
我們感謝社群願意積極採用 App Router 並提供反饋。我們正在調查許多錯誤報告，並感謝您建立的最小重現案例，幫助我們隔離問題和驗證修復。
自 13.4 版本以來，我們已修復多個高影響力的穩定性錯誤，這些修復包含在最新的修補版本（13.4.7）中。我們將持續高度關注效能和穩定性。
加強開發者教育
雖然我們相信 App Router 和現代 React 的新功能很強大，但它們也需要額外的教育和文件來說明這些新概念。
Next.js 功能
過去一年，我們從頭改寫了 Next.js 文件。這項工作現已上線於 nextjs.org/docs。我們想強調一些重要部分：
- Pages 和 App 切換：您可以使用文件左側的按鈕在學習 Pages Router 或 App Router 文件之間切換。此外，您可以根據選擇的路由器過濾搜尋結果。
- 改進內容和資訊架構：App Router 文件的幾乎每一頁都已更新，包括更清晰的結構和頁面間的連貫性，以及數百張新插圖來視覺化解釋 Next.js 的運作方式。
- 更多內容即將推出：我們還有更多工作要做。Vercel 的開發者體驗團隊正在努力提供更多學習資源（包括更新
/learn上的課程來教授 App Router）和真實世界的程式碼庫範例（包括重寫 Next.js Commerce）。
我們將在文件、Twitter、YouTube 等平台發布新內容。
新的 React 功能
我們也聽到了您關於 Next.js App Router 中可用新 React 功能教育的反饋。
-
伺服器元件 (Server Components)：需要注意的是，像伺服器元件和
"use client"指令 這樣的約定並非 Next.js 特有，而是 React 生態系統的重要部分。我們的團隊、Meta 的合作夥伴和其他獨立貢獻者正在努力提供更多關於這些主題的教育。這些概念仍處於早期階段，但我們對 React 生態系統和持續教育 充滿信心。
-
客戶端元件 (Client Components)：隨著最近關於伺服器元件的討論，需要注意的是客戶端元件並非劣化方案。客戶端是 React 模型的有效部分，不會消失。
您可以將客戶端元件視為現有的 Next.js 生態系統，您喜愛的函式庫和工具仍可正常運作。例如，我們常見的一個問題是是否需要為每個檔案添加
"use client"來使其成為客戶端元件。這並非必要，但我們理解這些概念是新的，需要時間學習。您只需標記頂層邊界，即程式碼從伺服器轉移到客戶端的位置。這種架構允許您將伺服器和客戶端元件交織在一起。 -
成長中的第三方生態系統：除了教育，圍繞 React 新功能的生態系統仍在成長。例如，來自 Chakra UI 開發者的 CSS-in-JS 函式庫 Panda CSS 剛宣布支援 React 伺服器元件。
-
伺服器動作 (Server Actions)（Alpha）：伺服器動作 能實現伺服器端資料變更、減少客戶端 JavaScript 和漸進增強的表單。我們目前不建議在生產環境中使用伺服器動作。我們感謝 Alpha 測試者的早期反饋，幫助我們塑造這項功能的未來。
感謝您
我們感謝許多人選擇學習並使用 Next.js 進行開發。
我們對效能、穩定性和開發者體驗的重點關注將體現在接下來的 Next.js 版本中。我們希望使用 Next.js 是愉快的——並讓您（和您的團隊）更高效。