连Netflix、Dcard和Twitch等知名服务都在用的应用程序开发框架Next.js,推出最新版本Next.js12,官方提到,这是有史以来最大的更新,添加的功能包括Rust编译器和中介层(Middleware),另外,还加入正在Alpha测试的URL组件导入功能,和ReactServerComponents,想尝鲜的开发者也可先试试新功能。
Next.js12新的Rust编译器,能实现更快速的构建,并且在本地端开发时,让开发者更快得到反馈。这个新的Rust编译器创建在开放平台SWC上,其优化了捆绑和编译,因此本地快速刷新(FastRefresh)速度可达3倍快,而构建生产用软件则有5倍快。FastRefresh是Next.js的一项功能,能够在开发者对React组件进行编辑时,即时做出反馈。
除此之外,大型程序代码库的编译,能获得更多的速度提升,而且因为Next.js现在于控制台中,会对客户端和服务器FastRefresh计时,因此提升了性能的可观察性,官方也针对底层Webpack进行大量的改进,包括优化FastRefresh,并使得按需项目更可靠。
使用Rust进行编译,比使用Babel快了17倍,在Next.js12中已经默认激活,替代转换JavaScript和TypeScript文件的旧方法。Rust编译器向后兼容,用户现有的Babel配置会自动被忽略,官方接下来计划要移植热门的函数库。Rust编译器支持最小化,速度比Terser快7倍,不过最小化目前仍是可选项目,直到被彻底验证,才会用来取代多年的基础设施。
官方为了提升Next.js的灵活性,在Next.js加入中介层,也就是说,程序现在于用户传入的请求完成之前,可以执行额外的程序代码,像是重写、重新定向、添加标头或是流媒体HTML来修改回应。中介层可用在一组页面共享逻辑的任何内容,包括验证、机器人保护和处理不支持的浏览器等。中介层使用严格的Runtime,并且支持标准WebAPI。
Next.js12提供ES模块和URL导入功能,ES模块带来JavaScript官方标准化的模块系统,所有主要浏览器和Node.js都已经支持,通过支持更小的组件大小和JavaScript组件包,来推动Web生态系统发展。
官方提到,JavaScript正历经从旧标准过渡到ES模块的过程,Next.js协助开发者逐步采用这些改进,不必进行破坏性更新。Next.js12还支持通过URL导入ES模块,不需要额外的安装和构建步骤,URL导入让开发者可以直接以URL使用任何组件,因此Next.js就能像本地端相依项目一样,处理远程HTTPS资源。
Next.js12还加入ReactServerComponents,让开发者能够在服务器上渲染所有内容,包括组件本身。官方解释,这与服务器端渲染不同,ReactServerComponents不需要客户端JavaScript,因此呈现页面速度更快,能够进一步改善应用程序的用户体验。