25、服务器端渲染与实时订阅：提升Web应用性能与体验

服务器端渲染与实时订阅：提升Web应用性能与体验

服务器端渲染（SSR）实现

执行 npm run server 后，一切将完美运行。查看返回的标记，你会看到登录表单，或者登录后访问页面的所有内容。用户可以在客户端登录，动态获取新闻源，刷新页面时所有帖子直接呈现，无需单个 GraphQL 请求，因为服务器会将数据与 HTML 一并返回。这种方式不仅适用于 /app 路径，也适用于你实现的任何路径。

SSR 有诸多优点，它能为用户带来出色的性能和体验，但也需要大量工作，并且每次应用更改时都需要进行管理。

实时订阅的必要性

尽管我们构建的 GraphQL API 和前端都很先进，还引入了服务器端渲染，但目前用户需要手动刷新浏览器或设置 pollInterval 来保持显示更新。更好的解决方案是通过 WebSockets 实现 Apollo 订阅，这样可以在无需用户手动交互或轮询的情况下实时刷新用户界面。

GraphQL 与 WebSockets

使用 GraphQL 时，标准网络协议是 HTTP，但常规 HTTP 连接是一次性请求，只能响应请求时存在的数据。如果数据库中帖子或聊天记录发生更改，用户在执行另一个请求之前不会知晓，导致用户界面显示过时数据。

为解决此问题，可在特定间隔重新获取所有请求，但这不是好的解决方案，因为没有一个时间范围能使轮询高效，每个用户都会进行不必要的 HTTP 请求。

WebSockets 是更好的选择，它基于 TCP，允许客户端和服务器之间进行双向通信。客户端建