imported>Sunwuyuan：修正笔误，以及忘记加引用了

2026-02-06T08:06:57Z

修正笔误，以及忘记加引用了

新页面

{{NoteTA|G1=IT|G2=FL}}
{{Infobox software
| name = Next.js
| logo = nextjs-logo.svg
| logo alt = The Next.js logo, a stylization of its name
| logo caption = Next.js logo
| author = Guillermo Rauch<ref name=simplify>{{Cite web|last1=April 21|first1=Matt Asay in Developer on|last2=2020|last3=Pst|first3=9:51 Am|title=How Next.js aims to simplify front-end development|url=https://www.techrepublic.com/article/how-next-js-aims-to-simplify-front-end-development/|access-date=2020-10-20|website=[[TechRepublic]]|date=21 April 2020|language=en|archive-date=2022-05-23|archive-url=https://web.archive.org/web/20220523134058/https://www.techrepublic.com/article/how-next-js-aims-to-simplify-front-end-development/|dead-url=no}}</ref>
| developer = {{link-en|Vercel}} 和[[開放原始碼]]社群<ref>{{Cite web|url=https://github.com/vercel/next.js|title=vercel/next.js|website=GitHub|access-date=2019-03-17|archive-date=2019-03-16|archive-url=https://web.archive.org/web/20190316035131/https://github.com/vercel/next.js|url-status=live}}</ref>
| released = {{Start date and age|2016|10|25}}<ref name=originalRelease>{{Cite web|url=https://github.com/vercel/next.js/releases/tag/1.0.0|title=Next.js First Release|website=GitHub|date=2019-03-14|access-date=2019-03-17|archive-date=2020-10-10|archive-url=https://web.archive.org/web/20201010232115/https://github.com/vercel/next.js/releases/tag/1.0.0|url-status=live}}</ref>
| latest release qid = Q56062435
| repo = {{URL|https://github.com/vercel/next.js}}
| programming language = [[JavaScript]], [[TypeScript]] and [[Rust (programming language)|Rust]]
| platform = {{link-en|Web platform|Web platform}}
| size = 17.0 [[Megabyte|MB]]
| genre = [[Web application framework]]
| license = [[MIT License]]
| website = {{URL|https://nextjs.org}}
}}

'''Next.js'''是一個構建於[[Node.js]]之上的開源Web開發框架，支援基於[[React]]的Web應用程序功能，例如[[服务器端渲染|伺服器端渲染]]和生成靜態網站。React於官方文件內的“推薦的工具鏈”中提及Next.js，建議將其作為“使用Node.js構建伺服器渲染網站”的解決方案<ref name="React documentation">{{cite web |title=Recommended Toolchains |url=https://reactjs.org/docs/create-a-new-react-app.html#recommended-toolchains |website=React documentation |access-date=10 July 2021 |archive-date=2022-05-17 |archive-url=https://web.archive.org/web/20220517184627/https://reactjs.org/docs/create-a-new-react-app.html#recommended-toolchains |dead-url=no }}</ref>。傳統的React應用程式只能在客戶端瀏覽器中渲染內容，Next.js擴充了此功能以包括在伺服器端渲染的應用程式。

Next.js的版權和商標歸Vercel（前身為ZEIT）所有<ref>{{Citation |url=https://vercel.com/blog/zeit-is-now-vercel |title=ZEIT is now Vercel |date=21 April 2020 |accessdate=2022-05-18 |archive-date=2021-12-15 |archive-url=https://web.archive.org/web/20211215132411/https://vercel.com/blog/zeit-is-now-vercel |dead-url=no }}</ref>，該公司也維護和主導其開放原始碼專案的開發<ref>{{Cite web|url=https://vercel.com/home|title=Develop. Preview. Ship. For the best frontend teams – Vercel|website=vercel.com|access-date=2020-09-22|archive-date=2021-10-06|archive-url=https://web.archive.org/web/20211006015250/https://vercel.com/home|url-status=live}}</ref>。

== 背景 ==
Next.js是一個基于React的框架，它支援一些額外的功能，包括[[服务器端渲染|伺服器端渲染]]和靜態網站生成<ref name="compareStatic">{{Cite web|date=2020-07-02|title=Differences Between Static Generated Sites And Server-Side Rendered Apps|url=https://www.smashingmagazine.com/2020/07/differences-static-generated-sites-server-side-rendered-apps/|access-date=2020-10-19|website=[[Smashing Magazine]]|language=en|archive-date=2022-05-21|archive-url=https://web.archive.org/web/20220521111135/https://www.smashingmagazine.com/2020/07/differences-static-generated-sites-server-side-rendered-apps/|dead-url=no}}</ref>。React是一组[[JavaScript]]庫，傳統上用於構建使用JavaScript在客戶端瀏覽器中渲染的網頁應用程式<ref name="thakkar1">{{Citation|last=Thakkar|first=Mohit|title=Next.js|date=2020|url=https://doi.org/10.1007/978-1-4842-5869-9_3|work=Building React Apps with Server-Side Rendering: Use React, Redux, and Next to Build Full Server-Side Rendering Applications|pages=93–137|editor-last=Thakkar|editor-first=Mohit|place=Berkeley, CA|publisher=[[Apress]]|language=en|doi=10.1007/978-1-4842-5869-9_3|isbn=978-1-4842-5869-9|s2cid=241224880|access-date=2020-10-20|archive-date=2022-06-06|archive-url=https://web.archive.org/web/20220606214313/https://link.springer.com/chapter/10.1007/978-1-4842-5869-9_3|dead-url=no}}</ref>。然而開發者意識到這種策略存在一些問題，例如無法滿足無法訪問或禁用JavaScript的用戶、潛在的安全問題、明顯延長頁面載入時間以及可能損害網站的整體搜索引擎優化<ref name="thakkar1" />。諸如Next.js之類的框架利用允許在發送到客戶端之前在伺服器端渲染部分或全部網站來避開這些問題<ref name="thakkar1" /><ref name="thakkar2">{{Citation|last=Thakkar|first=Mohit|title=Adding Server-Side Rendering to Your React Application|date=2020|url=https://doi.org/10.1007/978-1-4842-5869-9_4|work=Building React Apps with Server-Side Rendering: Use React, Redux, and Next to Build Full Server-Side Rendering Applications|pages=139–152|editor-last=Thakkar|editor-first=Mohit|place=Berkeley, CA|publisher=[[Apress]]|language=en|doi=10.1007/978-1-4842-5869-9_4|isbn=978-1-4842-5869-9|s2cid=216333955|access-date=2020-10-20|archive-date=2020-10-26|archive-url=https://web.archive.org/web/20201026110157/https://link.springer.com/chapter/10.1007/978-1-4842-5869-9_4|dead-url=no}}</ref>。Next.js是最流行的React框架之一<ref>{{Cite web|last1=December 2|first1=Matt Asay in Developer on|last2=2019|last3=Pst|first3=11:58 Am|title=Why front-end development may be the new frontier|url=https://www.techrepublic.com/article/why-front-end-development-may-be-the-new-frontier/|access-date=2020-10-20|website=[[TechRepublic]]|date=2 December 2019|language=en|archive-date=2022-03-25|archive-url=https://web.archive.org/web/20220325153411/https://www.techrepublic.com/article/why-front-end-development-may-be-the-new-frontier/|dead-url=no}}</ref>。它是啟動新應用程序時可用的幾個推薦「工具鏈」之一，所有這些都提供了一個抽象層來協助完成常見的任務<ref name="SmashingStyle">{{Cite web|date=2020-09-17|title=Comparing Styling Methods In Next.js|url=https://www.smashingmagazine.com/2020/09/comparison-styling-methods-next-js/|access-date=2020-10-20|website=[[Smashing Magazine]]|language=en|archive-date=2022-03-19|archive-url=https://web.archive.org/web/20220319032558/https://www.smashingmagazine.com/2020/09/comparison-styling-methods-next-js/|dead-url=no}}</ref>。Next.js可以在Node.js上运行，而且可以使用[[npm]]或其他兼容的工具安装和管理版本。Next.js也可以在其他JavaScript运行时上使用，如[[Bun]]<ref>{{Cite web |title=Build an app with Next.js and Bun |url=https://bun.com/docs/guides/ecosystem/nextjs |website=Bun |language=en |access-date=2026-02-06}}</ref>和[[Deno]]。

Google已向Next.js專案捐款，在2019年貢獻了43個拉取請求（Pull request），協助修剪了未使用的JavaScript、減少了載入時間與增加了改進指標<ref name="insiders">{{Cite web|last1=January 31|first1=Matt Asay in Developer on|last2=2020|last3=Pst|first3=6:33 Pm|title=An insider's look at Google's web framework contributions to Next.js and more|url=https://www.techrepublic.com/article/insiders-look-at-googles-web-framework-contributions-to-next-js-and-more/|access-date=2020-10-19|website=[[TechRepublic]]|date=February 2020|language=en|archive-date=2022-05-21|archive-url=https://web.archive.org/web/20220521111136/https://www.techrepublic.com/article/insiders-look-at-googles-web-framework-contributions-to-next-js-and-more/|dead-url=no}}</ref>。截至2020年3月，該框架已被許多大型網站使用，包括[[Netflix]]、[[GitHub]]、[[優步|Uber]]、Ticketmaster和[[星巴克]]。<ref name="thakkar1" />2020年初，Vercel宣布募得了2100萬美元的[[A輪|A輪融資]]，用來支援軟體的改進<ref name="simplify" />。該框架的原作者Guillermo Rauch目前是Vercel的CEO，該項目的開發主管是 Tim Neutkens<ref>{{Cite web|date=2020-10-07|title=Static site generation with single page app functionality? That's what's coming Next(.js)|url=https://stackoverflow.blog/2020/10/07/qa-with-the-creators-of-next-js-on-version-9-5/|access-date=2020-10-20|website=Stack Overflow Blog|language=en-US|archive-date=2022-03-25|archive-url=https://web.archive.org/web/20220325153348/https://stackoverflow.blog/2020/10/07/qa-with-the-creators-of-next-js-on-version-9-5/|dead-url=no}}</ref>。

== 發展歷程 ==
Next.js於2016年10月25日首次在GitHub上作為開放原始碼專案發布<ref name="originalRelease" />。它最初是基於六個原則開發的：開箱即用的功能，無需設定，JavaScript無處不在，所有功能都用JavaScript編寫，自動程式碼拆分和伺服器渲染，可配置的資料獲取，預測請求和簡化部署<ref>{{Cite web|last=Krill|first=Paul|date=2016-10-31|title=Next step after Node.js: Framework for 'universal' JavaScript apps|url=https://www.infoworld.com/article/3136337/next-step-after-nodejs-framework-for-universal-javascript-apps.html|access-date=2020-10-20|website=[[InfoWorld]]|language=en|archive-date=2022-05-21|archive-url=https://web.archive.org/web/20220521082716/https://www.infoworld.com/article/3136337/next-step-after-nodejs-framework-for-universal-javascript-apps.html|dead-url=no}}</ref>。

Next.js 2.0於2017年3月發布，其中包括多項改善，使小型網站開發變得更加容易。還提高了構建效率並提高了熱模塊更換功能的可擴展性<ref>{{Cite web|last=Krill|first=Paul|date=2017-03-28|title=Next.js 2.0 plays better with React and JavaScript|url=https://www.infoworld.com/article/3185385/nextjs-20-plays-better-with-react-and-javascript.html|access-date=2020-10-20|website=[[InfoWorld]]|language=en|archive-date=2022-03-18|archive-url=https://web.archive.org/web/20220318200041/https://www.infoworld.com/article/3185385/nextjs-20-plays-better-with-react-and-javascript.html|dead-url=no}}</ref>。

7.0版於2018年9月發布，改進了錯誤處理並支持React的上下文API以改進動態路由處理。也是第一個升級到webpack 4的版本<ref>{{Cite web|last=Krill|first=Paul|date=2018-09-21|title=Next.js 7 framework compiles faster, supports WebAssembly|url=https://www.infoworld.com/article/3307190/nextjs-7-framework-compiles-faster-supports-webassembly.html|access-date=2020-10-20|website=[[InfoWorld]]|language=en|archive-date=2022-05-21|archive-url=https://web.archive.org/web/20220521092011/https://www.infoworld.com/article/3307190/nextjs-7-framework-compiles-faster-supports-webassembly.html|dead-url=no}}</ref>。

8.0版於2019年2月發布，是第一個提供無伺服器應用程式部署的版本，其中程式碼被拆分為按需運行的匿名函式（Lambda function）。該版本還減少了靜態匯出所需的時間和資源，並提高了預取性能<ref>{{Cite web|last=Krill|first=Paul|date=2019-02-14|title=Next.js 8 now supports serverless apps|url=https://www.infoworld.com/article/3340817/nextjs-8-now-supports-serverless-apps.html|access-date=2020-10-20|website=[[InfoWorld]]|language=en|archive-date=2022-05-21|archive-url=https://web.archive.org/web/20220521093924/https://www.infoworld.com/article/3340817/nextjs-8-now-supports-serverless-apps.html|dead-url=no}}</ref>。

9.3版於2020年3月發布，包括各種優化以及全域Sass和CSS模組支持<ref>{{Cite web|last=Krill|first=Paul|date=2020-03-12|title=Next.js upgrade emphasizes static site generation|url=https://www.infoworld.com/article/3532316/nextjs-upgrade-emphasizes-static-site-generation.html|access-date=2020-10-20|website=[[InfoWorld]]|language=en|archive-date=2022-05-21|archive-url=https://web.archive.org/web/20220521093152/https://www.infoworld.com/article/3532316/nextjs-upgrade-emphasizes-static-site-generation.html|dead-url=no}}</ref>。

於2020年7月27日，Next.js 9.5版發布，增加了包括增量靜態再生（incremental static regeneration, ISR）、重新寫入和重新導向支援在內的新功能<ref>{{Cite web|url=https://www.infoworld.com/article/3568468/nextjs-adds-incremental-static-pages-regeneration.html|title=Next.js adds incremental static pages regeneration|first=Paul|last=Krill|date=July 27, 2020|website=[[InfoWorld]]|access-date=September 22, 2020|archive-date=October 2, 2020|archive-url=https://web.archive.org/web/20201002003602/https://www.infoworld.com/article/3568468/nextjs-adds-incremental-static-pages-regeneration.html|url-status=live}}</ref>。

於2021年6月15日，Next.js第11版發布，其中包括：Webpack 5支援、實時協作編碼功能預覽「Next.js Live」，以及從Create React App自動轉換為Next.js的實驗性功能相容形式「Create React App Migration」<ref>{{cite web|title=Next.js 11|url=https://nextjs.org/blog/next-11|accessdate=2021-07-10|archive-date=2022-05-07|archive-url=https://web.archive.org/web/20220507194121/https://nextjs.org/blog/next-11|dead-url=no}}</ref>。

2021年10月26日，Next.js 12發布，增加了Rust編譯器，使編譯速度更快，支持AVIF，Edge Functions與中介軟體，原生ESM與URL輸入<ref>{{Cite web|title=Next.js 12|url=https://nextjs.org/blog/next-12|access-date=2021-10-27|website=nextjs.org|language=en|archive-date=2022-06-02|archive-url=https://web.archive.org/web/20220602154946/https://nextjs.org/blog/next-12|dead-url=no}}</ref>。

2022年10月26日，Vercel 發布 Next.js 13，這次重大更新在[[軟件版本週期|beta]]版本帶來新的路由模式App Router，支援佈局（layouts）、React 伺服器元件（React Server Components）、串流（streaming），以及一套全新的資料擷取方法。此外，Vercel 同步公佈前端開發工具鏈Turbo，其中包含作為Webpack後繼者的Turbopack，以及用於增量建置系統的Turborepo。<ref>{{Cite web |title=Next.js 13 |url=https://nextjs.org/blog/next-13 |website=nextjs.org |date=2022-10-25 |language=en |last=Orbán |first=Balázs |last2=Oliveira |first2=Delba de |last3=Kang |first3=DongYoon |last4=Liu |first4=Jiachi |last5=Kasper |first5=J. J. |last6=Robinson |first6=Lee |last7=Teegarden |first7=Maia |last8=Markbåge |first8=Sebastian |last9=Ding |first9=Shu |access-date=2025-09-08}}</ref>

2023年5月，Next.js 13.4發布，App Router 轉為穩定版本，開發者可可以在產品環境中使用。<ref>{{Cite web |title=Next.js 13.4 |url=https://nextjs.org/blog/next-13-4 |website=nextjs.org |date=2023-05-04 |language=en |last=Markbåge |first=Sebastian |last2=Neutkens |first2=Tim |access-date=2025-09-08}}</ref>

2023年10月，Next.js 14發布，此版本透過Edge Runtime優化了記憶體管理。<ref>{{Cite web |title=Release v14.0.0 · vercel/next.js |url=https://github.com/vercel/next.js/releases/tag/v14.0.0 |website=GitHub |language=en |last=vercel |access-date=2025-09-08}}</ref>

2024年10月，Next.js 15發布，此版本引入了基於 Rust 語言、速度更快的打包工具Turbopack，並支援 React 19 和非同步請求 API。<ref>{{Cite web |title=Release v15.0.0 · vercel/next.js |url=https://github.com/vercel/next.js/releases/tag/v15.0.0 |website=GitHub |language=en |last=vercel |access-date=2025-09-08}}</ref>

== 樣式和功能 ==
Next.js支持CSS樣式以及預編譯的SCSS和SASS、CSS-in-JS和StyledJSX<ref name="SmashingStyle" />。此外，它也利用[[TypeScript]]支援和智慧型捆綁構建<ref>{{Cite web|url=https://www.infoworld.com/article/3340817/nextjs-8-now-supports-serverless-apps.html|title=Next.js 8 now supports serverless apps|first=Paul|last=Krill|date=February 14, 2019|website=[[InfoWorld]]|access-date=September 22, 2020|archive-date=October 2, 2020|archive-url=https://web.archive.org/web/20201002001850/https://www.infoworld.com/article/3340817/nextjs-8-now-supports-serverless-apps.html|url-status=live}}</ref>。開放原始碼編譯器Babel用於將程式碼轉換和編譯成瀏覽器可用的JavaScript。[[Webpack]]，是另一個開放原始碼工具，用於在之後打包模組。所有這些工具都在指令終端機中與[[Npm|NPM]]一起使用<ref name="insiders" />。

Next.js的主要特點是使用伺服器端渲染來減輕網頁瀏覽器的負擔並提供增強安全性。這可以針對應用程式的任何部分或整個專案完成，從而允許將內容豐富的頁面單獨挑出來用於伺服器端渲染<ref name="thakkar1" />。也可以僅針對首次訪客進行，以減輕尚未下載任何網站資產的網路瀏覽器的負載<ref name="thakkar2" />。「熱重載（Hot reloading）」功能會在更改發生時偵測更改並重新渲染適當的頁面，因此伺服器也避免重新啟動。允許對應用程式的程式碼所做的更改立即反映在網頁瀏覽器中，儘管某些瀏覽器會要求重新整理<ref name="thakkar1" />。該軟件使用基於檔案系統的路由讓開發更便利，與包括對動態路由的支援。其他功能包括熱模組替換，以便可以實時替換模組，自動程式碼拆分，僅包括載入頁面所需的程式碼，以及頁面預取減少載入時間<ref name="thakkar1" />。

Next.js還支持增量靜態再生（ISR）<ref>{{Cite web|url=https://vercel.com/docs/concepts/next.js/incremental-static-regeneration|title=Incremental Static Regeneration with Next.js|website=Vercel|access-date=2022-03-06|language=en|url-status=no|archive-date=2022-04-10|archive-url=https://web.archive.org/web/20220410102729/https://vercel.com/docs/concepts/next.js/incremental-static-regeneration}}</ref>和靜態站點生成（SSG）網站的編譯版本通常會在構建期間構建並以.next文件夾的型式儲存。當用戶提出請求時，作為靜態HTML頁面的預構建版本將被緩存並發送出去。這會使得載入時間非常快速，但它並非適合每個網站，尤其是對於經常更改並利用大量用戶輸入的互動式網站將會變得不適合。

== 外部連結 ==

* [https://nextjs.org/ Next.js 網站]{{Wayback|url=https://nextjs.org/ |date=20200629101702 }}
* [https://github.com/vercel/next.js Next.js 原始碼]{{Wayback|url=https://github.com/vercel/next.js |date=20200703082358 }}

== 参考文獻 ==
<references />

[[Category:JavaScript函式庫]]
[[Category:网络应用程序]]

Next.js - 版本历史

imported>Sunwuyuan：​修正笔误，以及忘记加引用了

imported>Sunwuyuan：修正笔误，以及忘记加引用了