CSR vs SSR vs Prerender,我应该选择哪一个?

CSR vs SSR vs Pre-render, which one should I choose?

目前我的项目分为两部分,一是登录前,一是登录后。

我想实现的是,在登录需要快速和SEO友好之前,我应该选择预渲染还是SSR?

登录后,我们可以选择CSR(这样客户端就可以等待页面加载)。

或者,我可以做两个 CSR,一个用于登录前(快速加载),一旦客户端登录,通过 JWT 令牌,重定向到登录后 CSR 页面?

谢谢

对于需要抓取的页面,CSR 很可能不是一个选项。那么问题就变成了你选择预渲染还是SSR。答案是视情况而定。

SEO 内容是静态的,还是取决于其他后端 API 在给定时间的响应?

如果它是静态的,预渲染应该就足够了。但是如果它依赖于其他 APIs,内容可能会在运行时发生变化,你将不得不做真正的 SSR 来适应它。不过,SSR 在服务器上占用的资源更多。

至于登录后的部分,反正应该不会被机器人爬取,所以对所有登录的页面做CSR是可以的。尽管 CSR 本身并不意味着您的初始加载速度会明显加快,但还有很多因素需要考虑,例如 HTML 文档大小、网络传输延迟、您自己的服务的其他服务的响应时间取决于 BUT,以及使用 service worker 和 app-shell 模型,与 SSR 相比,CSR 应该几乎总是更快。我建议研究一下以提高 CSR 速度。 Link

视情况而定。

如果 SEO 无关紧要 — 例如一个位于登录屏幕后面的应用程序 — 那么 CSR 就可以了,你只需要像 ReactJS

这样的东西

如果您需要好的 SEO:

a) 如果您可以预测内容 以在构建时生成它(例如:博客),那么您需要 SSG(在构建时创建的静态内容)并且应该选择 Gatsby 或 NextJS

b) 如果您无法预测content/possible请求(例如:搜索页面),服务器将需要按需生成页面,因此你需要动态 SSR(根据用户访问时间创建的内容)并且应该选择像 NextJS 这样的东西。

注意:NextJS 允许您在同一项目中有选择地混合使用 3 种主要渲染形式。因此,如果您需要 SEO,这是最佳选择。