简介

Next.js是一个构建于Node.js之上的开源Web开发框架，支持基于React的Web应用程序功能，例如服务端渲染和生成静态网站。React于官方文件内的“推荐的工具链”中提及Next.js，建议将其作为“使用Node.js构建服务器渲染网站”的解决方案。传统的React应用程序只能在客户端浏览器中渲染内容，Next.js扩展了此功能以包括在服务端渲染的应用程序。

Next.js的著作权和商标归Vercel（前身为ZEIT）所有，该公司也维护和主导其开放源代码项目的开发。

背景 Next.js是一个React框架，它支持一些额外的功能，包括服务端渲染和静态网站生成。React是一个JavaScript库，传统上用于构建使用JavaScript在客户端浏览器中渲染的网页应用程序。然而开发者意识到这种策略存在一些问题，例如无法满足无法访问或禁用JavaScript的用户、潜在的安全问题、明显延长页面加载时间以及可能损害网站的整体搜索引擎优化。诸如Next.js之类的框架利用允许在发送到客户端之前在服务端渲染部分或全部网站来避开这些问题。Next.js是最流行的React框架之一。它是启动新应用程序时可用的几个推荐“工具链”之一，所有这些都提供了一个抽象层来协助完成常见的任务。Next.js需要Node.js而且可以利用Node Package Manager进行启动。

Google已向Next.js项目捐款，在2019年贡献了43个拉取请求（Pull request），协助修剪了未使用的JavaScript、减少了加载时间与增加了改进指针。截至2020年3月，该框架已被许多大型网站使用，包括Netflix、GitHub、Uber、Ticketmaster和星巴克。2020年初，Vercel宣布募得了2100万美元的A轮融资，用来支持软件的改进。该框架的原作者Guillermo Rauch目前是Vercel的CEO，该项目的开发主管是 Tim Neutkens。

发展历程 Next.js于2016年10月25日首次在GitHub上作为开放源代码项目发布。它最初是基于六个原则开发的：开箱即用的功能，无需设置，JavaScript无处不在，所有功能都用JavaScript编写，自动代码拆分和服务器渲染，可配置的资料获取，预测请求和简化部署。Next.js 2.0于2017年3月发布，其中包括多项改善，使小型网站开发变得更加容易。还提高了构建效率并提高了热模块更换功能的可扩展性。7.0版于2018年9月发布，改进了错误处理并支持React的上下文API以改进动态路由处理。也是第一个升级到webpack 4的版本。8.0版于2019年2月发布，是第一个提供无服务器应用程序部署的版本，其中代码被拆分为按需运行的匿名函数（Lambda function）。该版本还减少了静态导出所需的时间和资源，并提高了预取性能。9.3版于2020年3月发布，包括各种优化以及全局Sass和CSS模块支持。于2020年7月27日，Next.js 9.5版发布，增加了包括增量静态再生（incremental static regeneration, ISR）、重新写入和重定向支持在内的新功能。于2021年6月15日，Next.js第11版发布，其中包括：Webpack 5支持、实时协作编码功能预览“Next.js Live”，以及从Create React App自动转换为Next.js的实验性功能兼容形式“Create React App Migration”。2021年10月26日，Next.js 12发布，增加了Rust编译器，使编译速度更快，支持AVIF，Edge Functions与中间件，原生ESM与URL输入。

样式和功能 Next.js支持CSS样式以及预编译的SCSS和SASS、CSS-in-JS和StyledJSX。此外，它也利用TypeScript支持和智能捆绑构建。开放源代码编译器Babel用于将代码转换和编译成浏览器可用的JavaScript。Webpack，是另一个开放源代码工具，用于在之后打包模块。所有这些工具都在指令终端中与NPM一起使用。

Next.js的主要特点是使用服务端渲染来减轻网页浏览器的负担并提供增强安全性。这可以针对应用程序的任何部分或整个项目完成，从而允许将内容丰富的页面单独挑出来用于服务端渲染。也可以仅针对首次访客进行，以减轻尚未下载任何网站资产的网络浏览器的负载。“热重载（Hot reloading）”功能会在更改发生时侦测更改并重新渲染适当的页面，因此服务器也避免重启。允许对应用程序的代码所做的更改立即反映在网页浏览器中，尽管某些浏览器会要求刷新。该软件使用基于文件系统的路由让开发更便利，与包括对动态路由的支持。其他功能包括热模块替换，以便可以实时替换模块，自动代码拆分，仅包括加载页面所需的代码，以及页面预取减少加载时间。

Next.js还支持增量静态再生（ISR）和静态站点生成（SSG）网站的编译版本通常会在构建期间构建并以.next文件夹的型式存储。当用户提出请求时，作为静态HTML页面的预构建版本将被缓存并发送出去。这会使得加载时间非常快速，但它并非适合每个网站，尤其是对于经常更改并利用大量用户输入的交互式网站将会变得不适合。