Next.js 的故事：一个框架如何尝试修复 Web

由 Mux 主办的 DEV 全球展示挑战赛：展示你的项目！

你有没有点击过某个链接，然后等了很久很久？不是短暂的停顿，而是久到让你怀疑页面到底会不会加载出来？

回到2015年，当时的网页看起来快速、简洁、交互性强且响应迅速。React技术随处可见。单页应用程序（SPA）占据主导地位。一切都显得那么进步。

但表面之下，却有些不对劲。

网站充斥着大量的 JavaScript，页面加载速度极慢，搜索引擎无法正确索引。用户明显感受到了延迟。开发人员则疲于应对各种隐形问题：构建缓慢、工具繁琐、部署脆弱。

每个人都能感觉到网络正在崩溃。但没有人能提出真正的解决方案。

直到一位来自阿根廷的自学成才的开发者决定修复它。

早期岁月：一个更简单的网络

最初，网络很简单。浏览器请求文件，服务器返回纯HTML。没有JavaScript，没有交互功能，只有快速的静态页面。

随后出现了动态网站、个性化内容、数据库和用户登录功能。网络不再仅仅是文档，而成为了一种体验。

但用户想要更多。

1995年，一位名叫布伦丹·艾希的程序员仅用了10天就创建了JavaScript。虽然它还很粗糙，但却让网页变得可以交互。随后出现了Ajax，它允许网站在不重新加载页面的情况下获取数据。网络由此发展成熟。

React 的崛起（及其带来的问题）

随着网站变得越来越复杂，开发者需要结构化的工具。这时，React应运而生。

React 专注于一件事：用户界面。它引入了组件、JSX以及一种构建用户界面的简便方法。但 React 只是一个库，而不是一个完整的框架。开发者需要自行拼凑：

• Webpack 配置
• Babel插件
• 路由器
• API 处理程序
• 部署管道

React 让前端变得优雅，但构建完整的应用程序仍然是一场噩梦。

Next.js 的诞生

在旧金山，一位名叫吉列尔莫·劳赫的开发者看到了这种混乱局面。他并非来自硅谷，而是一位来自阿根廷的自学成才的程序员，16岁就辍学了。

他早在WebSocket成为主流之前就创建了Socket.io，并曾担任一家创业公司的首席技术官。他信奉开源、简洁和更美好的网络。

2016年，他的公司Zeit （后更名为Vercel）推出了一款名为Now的前端部署工具。但Rauch的愿景远不止于此，他想要的是一个包含以下功能的全栈React框架：

• 内置路由
• 服务器端渲染
• 零配置

他的团队认为这很冒险。他称之为Next.js。

2016年10月25日，他们向世界发布了Next.js。它遵循六项关键原则：

1. 无需设置，无需复杂配置。
2. JavaScript 无处不在，一种用于前端和后端的语言。
3. 代码拆分，加快页面加载速度。
4. 默认采用服务器端渲染，提升搜索引擎优化效果和性能。
5. 灵活的数据获取——简易的 API 处理。
6. 一键部署——轻松发布。

开发者们非常喜欢它。Next.js 为他们提供了足够的结构，又不会限制他们的发展。

静态回归

一年后，Next.js 引入了增量静态页面重生成 (ISR)，这是一种在静态页面部署后对其进行更新的方法。

这彻底改变了游戏规则。网站现在可以：

• 快速（类似静态网站）
• 动态的（例如服务器端渲染的应用程序）

无需再等待完全重建。无需再使用过时的数据。只需按需即可获得卓越性能。

竞争（及争议）

Next.js并非孤例。Gatsby （一个基于GraphQL的静态网站构建器）也越来越受欢迎。但Gatsby也存在一些问题：

• 缓慢构建
• 损坏的插件
• 关键功能需付费才能使用

开发者们开始转向 Next.js，因为它具有可靠性和灵活性。

与此同时，Vercel（前身为 Zeit）进行了品牌重塑，并成为 Next.js 的首选平台。它提供：

• 立即部署
• 全局边缘函数
• 内置图像优化

但一些开发者担心：Next.js 是否与 Vercel 的联系过于紧密？

随后，在 2022 年，一场隐私争议爆发了。Next.js 默认启用遥测（使用情况跟踪）功能。许多开发者感到被欺骗。Vercel 很快将其改为可选启用，但问题依然存在：

我们能信任我们所依赖的框架吗？

Next.js 今日：强大功能与复杂性

如今，Next.js 的应用非常广泛，Twitch、TikTok、Netflix 等公司都在使用它，甚至React 的官方文档也推荐它。

但新的挑战已经出现：

• Astro、Remix、SvelteKit是采用更简单方法的新框架。
• Next.js 13 的应用路由是一个重大变革，打破了旧有的模式。
• 安全风险： 2025 年将暴露一个重大的中间件漏洞。

问题不仅仅是“Next.js 的下一步是什么？”，而是“我们想要什么样的网络？”

• 快速的网络？
• 一张美丽的网？
• 开放的网络？

或者三者皆是？

你觉得呢？Next.js 是未来框架吗？还是会有新的框架取而代之？欢迎在评论区留言！