reactjs - 在客户端上为动态页面（使用 CDN 缓存时）执行 SSR 和水合单页应用程序是否有意义？

我有一个使用 React + Redux + Firebase 构建的博客网站（单页应用程序）。

我一直在考虑s-maxage为我的页面实现 SSR 和 CDN 缓存（1 天）。

我将为所有页面请求执行 SSR。只有当我能够在这些响应上使用 CDN 缓存时才有意义，对吧？目前，我只将 CDN 缓存用于静态资产，例如index.html, *.js, etc.

注意：我已经为机器人做了 SSR。并且这些响应没有被缓存在任何地方。每个访问我的页面的机器人都会获得页面的全新渲染。

例如：

但是，如果在1 dayCDN 缓存期间，我使用管理 UI 更新了数据库上该页面的内容，该怎么办？

那么该缓存将是陈旧的，即使从s-maxage角度来看它仍然有效。

那时会发生什么？

选项1

用户在补水前后会看到内容闪烁。这是最好的情况，因为此时帖子可能已被删除，并且在水合完成后，用户会看到旧内容和未找到的页面之间闪烁。

选项#2

我可以在处理水合过程时以某种方式显示微调器/加载器，并且仅在完成后才显示内容。但是，IMO，这基本上首先消除了 SSR 的好处。它基本上是带有额外步骤的 CSR（客户端渲染）。

选项#3

编辑特定页面后，我可以从我的 CDN 中使用某种 API 来清除/使该特定缓存无效。然后它必须为下一个请求重新渲染。

Obs：我无法使用选项#3。我的 CDN 是您从 Firebase Hosting 获得的。我只能选择一次清除/使整个 CDN 缓存失效。我不能选择特定的缓存来失效。

我认为这三个选项中的任何一个都不理想。所以我要问：为需要补水的单页应用程序的动态内容进行 SSR 真的有好处吗？人们通常会这样做吗？他们通常遵循三个选项中的哪一个？有没有更好的第四种选择？

标签： reactjscachingcdnserver-side-renderinghydration