Next.js 11正式发布，React 应用的后端渲染

2021年6月22日 273点热度 0人点赞 0条评论

文 | 局长

出品 | OSC开源社区（ID：oschina2013）

Next.js 11 已正式发布，新版本主要变化：

一致性：提供精心打磨的解决方案以支持最佳用户体验的系统
提升性能：进一步优化以缩短冷启动时间，以便开发者更快地开始编码
next/script：自动优先加载第三方脚本以提升性能
next/image：通过自动尺寸检测和对模糊占位符的支持，减少布局偏移并创建更流畅的视觉体验
Webpack 5：现在默认为所有 Next.js 应用程序启用 Webpack 5，为所有 Next.js 开发人员带来这些好处
创建 React App 迁移（实验阶段）：自动转换 Create React App 以兼容 Next.js
Next.js Live（预览版）：与团队成员在浏览器中实时编码

提升性能

开发团队表示，从 Next.js 10 开始，他们一直致力于进一步优化 Next.js 的开发者体验。在 10.1 和 10.2 中，他们将启动时间缩短了 24%，并通过 React Fast Refresh 将处理时间再减少了40%。

现在，Next.js 11 包含对 Babel 的另一项优化，以进一步缩短启动时间。开发团队为 webpack 创建了一个全新的 Babel 加载器实现，优化了加载并添加了内存配置缓存层。因此，实际使用上对开发人员来说并没有变化，但最终却带来了更快的开发体验。

Webpack 5

在 Next.js 10.2 中，开发团队将 webpack 5 的推广范围扩大到所有在next.config.js文件中没有自定义 webpack 配置的应用程序。现在，他们将 webpack 5 作为所有 Next.js 应用程序的默认配置，预计将会提供多项功能和改进(https://nextjs.org/blog/next-10-2#webpack-5)。

开发团队表示会与社区密切合作，以确保顺利过渡到 webpack 5，现有的超过 3400 个 Next.js 集成测试在每个启用 webpack 5 的 PR 上运行。他们说道，如果开发者的应用程序有一个自定义的 webpack 配置，建议遵循 webpack 5 的升级文档(https://nextjs.org/docs/messages/webpack5)。

Next.js Live（预览版）

Next.js Live 通过利用 ServiceWorker、WebAssembly 和 ES Module 等前沿技术，将整个开发过程放在了网络浏览器中。因此这也开启了一些可能性，比如通过一个 URL 来即时协作和分享，而不需要构建步骤。对于开发者来说，这意味着更快的反馈循环，更少的等待构建时间，以及在浏览器中进行实时结对编程和编辑。