# 策展 · X (Twitter) 🔥

> 📖 本站完整內容索引（documentation index）：[llms.txt](/llms.txt)

> 作者：Railway (@Railway) · 平台：X (Twitter) · 日期：2026-04-07

> 原始來源：https://x.com/Railway/status/2041512880290296198

## 中文摘要

Railway 捨棄 Next.js 轉向 Vite 與 TanStack，大幅提升開發效率。

Railway 近期將其整個生產環境的前端架構從 Next.js 遷移至 Vite 與 TanStack Router，透過兩次 Pull Request 完成且達成零停機時間，展現了對開發迭代速度的極致追求。

**遷移背景與動機**
Railway 團隊指出，Next.js 雖曾協助其產品成長，但隨著專案規模擴大，其架構已不再適用。主要痛點包括：
- **建置時間過長**：建置時間超過 10 分鐘，其中一半時間耗費在 Next.js 的頁面優化上，嚴重拖累每日多次部署的開發節奏。
- **架構不符需求**：Railway 的應用程式高度依賴客戶端互動（如畫布、Websockets），Next.js 強推的「伺服器優先」模式與其需求背道而馳，導致團隊必須在 Pages Router 之上自行開發複雜的變通方案來處理佈局。

**技術選擇與優勢**
團隊選擇轉向 Vite 與 TanStack Start，旨在追求更明確、以客戶端為主且迭代快速的技術棧：
- **型別安全路由**：路由參數與搜尋參數皆可自動推斷，並支援全樹狀結構的自動補全。
- **原生佈局支援**：透過路徑無關的佈局路由（Pathless layout routes），取代了過去所有 hacky 的變通做法。
- **極致開發體驗**：實現即時 HMR（熱模組替換）與近乎零秒的開發伺服器啟動時間，大幅縮短回饋週期。
- **明確的控制權**：減少框架內部的「魔法」，讓開發者對底層運作有更多掌控。

**遷移執行策略**
這次大規模遷移僅透過兩次 Pull Request 完成，且未造成服務中斷：
- **第一階段**：移除所有 Next.js 專屬依賴（如 `next/image`、`next/head`），改用原生瀏覽器 API 或框架無關的替代方案，確保程式碼與框架解耦。
- **第二階段**：正式替換框架，將 200 多個路由遷移至新架構，並引入 Nitro 作為伺服器層，整合重定向、安全標頭與快取規則。

**取捨與反思**
儘管獲得了更快的建置速度與開發體驗，團隊也坦承了必要的犧牲：
- **功能替代**：需自行處理影像優化（改用 Fastly）、SEO 與網站地圖等功能，雖然增加了開發工作，但減少了外部依賴。
- **成熟度考量**：TanStack Start 較新，可能存在粗糙之處，但團隊認為其發展方向正確且維護者回應積極，因此願意承擔此風險。

**對前端部署的觀點**
Railway 強調，前端框架應優化迭代速度，而基礎設施應讓部署過程「隱形」。透過 Vite 的 asset 模型，每個模組擁有獨立的內容雜湊（content-hashed）區塊，不僅大幅縮短使用者下載量，也讓持續整合與預覽部署變得更加高效。此次遷移不僅是技術堆疊的更換，更是為了消除程式碼編寫到使用者體驗之間的瓶頸。

## 標籤

框架更新, Web, Next, React, Railway, Next.js, Vite