首页 > 解决方案 > React 中的服务器端渲染对动态呈现有帮助吗?

问题描述

我的问题:对于我的论文,我正在创建一个拍卖网站。我有一个管理面板,我想在其中进行一些配置,以便管理员可以指定如果在拍卖结束前 10 天,一些组件应该以不同的方式显示,一些组件根本不可见等。这就是我所说的动态呈现。

我的问题:现在我正在研究架构,想知道 SSR 是否有任何帮助?我已经知道它可以将我数据库中某些集合的下载时间缩短一半,但我想知道是否有任何方法可以对动态演示本身有所帮助?

我已经知道的:我已经阅读了所有关于 ssr 或通用渲染在反应中的优点和缺点。现在我只是想知道它是否对动态演示有任何帮助,或者我选择 SSR 还是 CSR 都没关系。

小问题:我还没有准备好整个架构。我所知道的是,我想要一个数据库,一个用于管理员、后端和前端(ssr 或 csr)的单独应用程序。我对如何管理这种动态演示的第一个想法是在数据库中存储一些规则。如果管理员想要更改任何内容,则可以在管理应用程序中配置规则。规则应该发送到后端并使用来自前端的一些额外数据进行计算。然后后端可以向前端发送一些标志,指示要显示哪些组件等。理论上,如果我使用 SSR,我可以将计算转移到例如 NodeJs 服务器。我想知道的是;你能想出更好的方法来处理动态演示吗?我最害怕的是前端的无数ifs。我想有一些更优雅的解决方案,但到目前为止我没有其他想法。有一段时间我考虑过一个评分系统,但我认为它太复杂了(而不是发送一个标志,发送一个分数,前端会根据分数显示正确的东西)。它也不能解决前端的 ifs 问题。

我知道在 StackOverflow 上可以回答而不是讨论的问题是首选,但我真的被困住了,希望得到帮助。

标签: node.jsreactjsrestarchitectureserver-side-rendering

解决方案


基本上,SSR 可以在您的页面上提供一些速度,因为当反应脚本将以 API 调用结束时,您的所有数据都不会被尝试获取。请求页面时从数据库中获取数据,并将其传递给组件以使用脚本进行渲染。

另一个非常基本的优势以及每个人都采用 SSR 方式的原因是 SEO。您无法通过 React CSR 实现 SEO 页面。这是因为 google bot 等会尝试抓取您的页面而不进行渲染。就像试图“查看页面的源代码”一样。当您在 CSR 中时,页面没有内容,只有初始反应 div 为空。您需要 SSR 来获取有关用户第一个请求的数据。

SSR 在用户的第一个请求上带来数据,直到重新加载。与此同时,反应路由器从 api 获取数据。

让我知道这是否对您有帮助。

PS:也是一个有用的链接https://medium.com/walmartlabs/the-benefits-of-server-side-rendering-over-client-side-rendering-5d07ff2cefe8


推荐阅读