Next.js static 服务器端渲染和 Gatsby.js

Question

我想用 Next.js 建立一个网站，并试图更好地了解他们的Automatic Static Optimization以及您可以使用它的不同方式。
首先， Gatsby.js是一个 static 站点生成器。 当您运行 Gatsby 的build命令时，您会得到一个完全是 static 的/public文件夹，并且可以在不需要某种后端的情况下进行部署。 如果我理解正确，这意味着整个 static 文件夹在第一次请求时被发送到客户端，从那时起，包括路由在内的一切都发生在客户端。
另一方面，使用 Next.js 生成 static，这意味着所有页面在构建时都在服务器上预渲染（如 Gatsby），但应用程序仍然依赖于后端（成熟的服务器或无服务器功能）用于路由。 即，页面是预渲染的，但与 Gatsby 不同的是，它们是按请求发送给客户端的，即在导航时。 （我发现这个答案说只有 Next 的初始请求，但是，与 Gatsby 有什么区别？）
我在这一切中感到困惑的是，像 Next 的Static HTML Export的文档。 他们首先说明

next export允许您将应用程序导出到 static HTML，它可以独立运行，无需 Node.js 服务器。

所以，听起来这个选项让我们能够像 Gatsby 一样使用 Next，即完全是 static 文件夹。
但后来他们 go 评论说：

如果您的页面没有getInitialProps您可能根本不需要next export ； 由于Automatic Static Optimization ， next build已经足够了。

但是自动 Static 优化仅指服务器端 static 预渲染，并且next build不会生成像 static 一样的 Gatsby 文件夹，可以部署为独立的文件夹。
那么我在这里错过了什么？ Gatsby.js 和 Next.js 有什么区别？ 盖茨比能做 Next 做不到的事情吗？ 我可以在不使用export命令的情况下使用 Next 构建一个完整的 static 站点吗？
最重要的是，我能否构建和部署一个 Next.js 应用程序，其中一些页面完全为 static（如 Gatsby），一些页面仅预渲染（ getStaticProps和getStaticPaths ），以及一些页面呈现在服务器端（ getServerSideProps ）？

提前非常感谢！

Answer 1

第一个请求是针对<url>/index.html的，因此不会将整个public发送给客户端。

Gatsby 优化了加载过程，以确保首先加载关键资源（HTML、CSS、JS），从而确保最佳的用户体验。 从那里它将加载呈现整个页面所需的剩余资源，并且还将从主页预取链接页面。 当然，如果您已请求到不同页面的路由，则客户端最初会为该页面获取 HTML，但随后的过程将类似。

Gatsby 在这方面仍然比 Next.js 更好（SSG 是 Next 的一个非常新的功能，这是 Gatsby 所做的核心） - 请参阅https://dev.to/notsidney/gatsby-won-against-next-js-in-这头对头 37ka 。

在回答您的问题时，是的，您可以使用 Next 进行完整 SSG、部分 SSR/SSG 和完整 SSR。 如果您想要完整的 SSG，则需要进行next export ，否则对于其他模式，您处于标准的 Next 领域，并且 Next 将同时处理 SSG/SSR，因为您运行的是传统的 web 服务器，可以同时提供 static 内容并执行动态固态硬盘。