服务器端渲染和客户端渲染有什么区别？

Question

这个问题在网络上有很多文章在讨论它，但考虑到我对网络开发的了解有多新，我认为我错过了一些内容来全面了解。

我的理解如下：

假设我们有一个 Node.js 服务器，并且我们正在为我们的 Web 应用程序使用 express。客户端呈现是当我没有在 Web 浏览器中输入 URL 时，它会向我的服务器创建 HTTP 请求。相反，客户端请求来自 JS 脚本（最初是在我使用根路由访问应用程序时从服务器加载的，例如：http://localhost:SOME_PORT/）。所以，假设我的请求是从数据库中获取有关某个用户的一些信息。例如，JS 脚本（使用 AJAX）不通过服务器，而是直接向数据库执行 XMLHTTPRequest（比如我通过一个名为 Fetch 的按钮触发它）而不是通过我的服务器，然后客户端（浏览器）将得到响应，然后将创建一个 HTML 文档并呈现它。与服务器端渲染相反，例如，我在浏览器中输入 URL，服务器拦截请求，并准备 HTML 文档以及请求的数据（如果有），并将其以 HTML 形式发送回浏览器渲染（因此在服务器端，客户端没有做任何工作，但实际显示页面）。

这是准确的吗？我对这两种风格的理解以及何时使用这两种风格都缺少什么？

Answer 1

假设我们有一个 Node.js 服务器，并且我们正在为我们的网络应用程序使用 express。

您在服务器上使用什么软件并不重要，但我们将使用它作为示例。

客户端呈现是当我没有在 Web 浏览器中输入 URL 时，它会创建对我的服务器的 HTTP 请求。相反，客户端请求来自 JS 脚本（最初是在我使用根路由访问应用程序时从服务器加载的，例如：http://localhost:SOME_PORT/）。

这将加载一个 HTML 文档，该文档加载了带有脚本元素的 JS。您不会直接加载脚本。

假设我的请求是从数据库中获取有关某个用户的一些信息。例如，JS 脚本（使用 AJAX）不通过服务器，而是直接向数据库执行 XMLHTTPRequest

没有。您仍然向 HTTP 服务器发出 HTTP 请求。

（假设我通过一个名为 Fetch 的按钮触发）而不是通过我的服务器，然后客户端（浏览器）将获得响应，然后将创建一个 HTML 文档并呈现它。

伊什。

客户端已经有一个 HTML 文档。通过客户端渲染，从该文档生成的 DOM 被修改（通常使用从服务器请求的新数据）。

与服务器端渲染相反，例如我在浏览器中输入一个 URL

为了使场景尽可能接近客户端呈现示例，假设您单击链接而不是输入 URL。

，服务器拦截请求，

请求是明确向服务器发出的，不会被拦截。这意味着它是为其他地方设计的。

并准备 HTML 文档以及请求的数据（如果有）并以 HTML 形式将其发送回浏览器进行渲染（因此在服务器端，客户端没有做任何工作，但实际显示页面） .

基本上。

---

简短的版本是：

通过服务器端渲染，在服务器上准备一个完整的 HTML 文档并传送到浏览器。

通过客户端渲染，DOM 在客户端被操作以生成相同的文档。