Reactjs React服务器端渲染性能问题

Reactjs React服务器端渲染性能问题,reactjs,server-side-rendering,Reactjs,Server Side Rendering,我正在做一个项目,涉及React、Redux和其他一些前端库。我读过很多关于服务器端渲染的好东西,听起来很酷。因此,我实现了服务器端渲染和客户端渲染。我对这两个版本进行了性能比较,发现服务器端渲染存在性能问题,我不确定我是否做错了什么。我发现服务器端渲染需要大量的CPU/mem资源,这大大降低了我的服务器速度。即使是在一个简单的页面上,它也必须处理复杂的react、redux逻辑,包括存储初始化、虚拟dom、每个请求的css提取。当流量很大时,情况会变得更糟,有时它会停止响应。我的项目很复杂,页

我正在做一个项目,涉及React、Redux和其他一些前端库。我读过很多关于服务器端渲染的好东西,听起来很酷。因此,我实现了服务器端渲染和客户端渲染。我对这两个版本进行了性能比较,发现服务器端渲染存在性能问题,我不确定我是否做错了什么。我发现服务器端渲染需要大量的CPU/mem资源,这大大降低了我的服务器速度。即使是在一个简单的页面上,它也必须处理复杂的react、redux逻辑,包括存储初始化、虚拟dom、每个请求的css提取。当流量很大时,情况会变得更糟,有时它会停止响应。我的项目很复杂,页面上有很多组件,有很多减速机和中间件。我知道我们可以通过使用缓存来缓解这种情况,但在我的项目中,我有数千个页面,内容需要根据url参数动态呈现,不能过时,因此缓存不是一个可行的解决方案。即使使用缓存,如果页面命中缓存,其渲染速度也比客户端渲染快。一旦缓存过期,服务器将再次变慢。另外,我觉得这种体验有点奇怪,因为从内容开始渲染到完成所需的时间比客户端渲染要长得多。总体而言,客户端渲染感觉更加平滑。知道为什么吗?

React纯粹用作客户端(CSR)库,实际上是在减轻服务器的负担,使其不必做任何其他工作,而只提供文件服务。所有计算都在客户端(浏览器)上进行,使用它们的CPU(解析和执行JavaScript、呈现反应树)和网络资源(获取API端点、解析响应)。请注意,即使流量增加,所有工作仍在所有客户机之间均匀分布,服务器只需跟上提供文件的速度

此外,企业社会责任解决方案至少还有一个很容易被忽视的优势。一旦执行了初始JavaScript包并发现了资源,浏览器仍然可以在获取网络资源(如图像)时解析和执行其余代码。这样,代码流和数据流可以并行执行

这在服务器上发生了巨大的变化。要呈现组件树(ReactDOMServer.renderToString/.renderToNodeStream),您需要首先获取初始呈现所需的所有资源(引入延迟),并将它们注入应用程序顶部。否则,React将仅呈现应用程序中不依赖于任何数据的部分。渲染大型组件树是CPU受限的任务。 更重要的是,注入的状态应该序列化,并与呈现的HTML一起传输到客户端,以便React能够正常工作。这需要通过线路向客户端发送更多数据


总而言之,启用SSR后,您的服务器所做的工作要比仅使用CSR时多得多。

感谢您的回复。根据我的经验,SSR实际上对性能的影响更大,因为它在服务器上投入了太多的工作。在现实世界中,我无法想象需要多少服务器来处理这个负载。呈现React需要的不仅仅是简单的html。然而,我仍然想知道我是否错过了任何东西或任何我忽略的优化方法,因为SSR被许多人推荐。这项技术只是实验性的还是我遗漏了什么