小编Len*_*hou的帖子

服务器端渲染如何兼容单页应用?

我的问题是,我无法理解像 Next.js 这样的服务器端渲染单页面应用程序框架如何在前端接收预渲染的完整 HTML,而无需重写整个页面。例如,nextjs 网站声明如下:

默认情况下,Next.js 预渲染每个页面。这意味着 Next.js 提前为每个页面生成 HTML,而不是由客户端 JavaScript 完成这一切。预渲染可以带来更好的性能和 SEO。每个生成的 HTML 都与该页面所需的最少 JavaScript 代码相关联。当浏览器加载页面时,其 JavaScript 代码就会运行并使页面完全交互。(这个过程称为水合作用。)

我了解这如何增强 SPA 在首页加载时的响应能力。但在第一次加载之后,是什么让服务器端渲染与 SPA 兼容?我认为这是由于我无法理解的根本误解而产生的,因此我还有一些进一步的问题可能会帮助您理解它:

  1. SSR SPA 是否始终以完整的预渲染 HTML 进行响应,还是仅针对首页加载进行响应?
  2. 如果前者为真,那么在后续响应中,客户端如何有效地仅呈现差异而不是重写整个页面?
  3. 否则,如果后者为真,那么 SSR SPA 后端如何判断何时响应第一个请求、何时响应应该是整个 HTML、与后续请求、何时大部分页面已经存在等等需要发送的是一些相对最少的信息?

我对 SSR 与 SPA 兼容的原因有什么误解?

非常感谢所有解决这个问题的人!

single-page-application reactjs server-side-rendering next.js

14
推荐指数
1
解决办法
5642
查看次数