CSR vs SSR vs Pre-render，我应该选择哪一个？

Question

目前，我的项目有两部分，一是登录前，一是登录后。 

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

登录后，我们可以选择CSR（这样客户端就可以等待页面加载了）。

或者，我可以做两个 CSR，一个用于登录前（快速加载），客户端登录后，通过 JWT 令牌重定向到登录后 CSR 页面？ 

谢谢

Answer 1

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

SEO 内容是静态的，还是在给定时间取决于其他一些后端 API 响应？

如果它是静态的，预渲染应该足够了。但是，如果它依赖于其他 API，则内容可能会在运行时发生变化，您必须执行真正的 SSR 以适应这种情况。但是，SSR 在服务器上占用更多资源。

至于登录后的部分，因为它可能无论如何都不应该被机器人抓取，所以对所有登录的页面做CSR是可以的。CSR 本身并不意味着您的初始加载速度会明显更快，但需要考虑很多因素，例如 HTML 文档大小、网络行程延迟、您自己的服务所依赖的其他服务的响应时间等.但是，除了使用 service worker 和使用 app-shell 模型外，CSR 几乎总是比 SSR 更快。我建议研究一下以提高 CSR 速度。关联

Answer 2

这取决于。

\n

如果SEO 无关紧要\xe2\x80\x8a\xe2\x80\x94\xe2\x80\x8ae.g。一个位于登录屏幕\xe2\x80\x8a\xe2\x80\x94\xe2\x80\x8athen CSR后面的应用程序很好，你只需要像ReactJS这样的东西

\n

如果您需要良好的 SEO：

\n

a) 如果你能预测内容（例如：博客），那么您需要 SSG（在构建时创建的静态内容）并且应该选择 Gatsby 或 NextJS 之类的内容

\n

b) 如果你能\xe2\x80\x99t预测内容/可能的请求（例如：搜索页面），服务器将需要按需生成页面，因此您需要动态SSR（在用户访问时创建的内容）和应该选择像NextJS这样的东西。

\n

笔记：NextJS 允许您在同一个项目中选择性地混合 3 种主要渲染形式。因此，如果您需要 SEO，这是最好的选择。

\n