ReactJS服务器端渲染似乎并没有改变客户端的情况

Question

我正在尝试优化我的大型ReactJS项目，但偶然发现了一个结论，即浏览器中的React代码没有利用服务器渲染的任何优势。 我确定服务器端呈现工作正常，我可以看到服务器返回的页面源中的data-reactid以及所有data-reactid 。

设置 ：服务器端代码在Node中呈现。 反应版本15.0.1。 我正在使用ClojureScript和朗姆酒，但最后没关系

测试环境 ：使用React.addons.Perf ，将其包装在客户端的初始安装周围。

测试1 ：正确的服务器端渲染

总时间约为1.8秒，包含根部分的时间约为1.5秒。 React.addons.Perf.printWasted()什么也不显示。

但是对我来说，最令人困惑的部分是React.addons.Perf.printOperations()显示了一个操作：使用整个应用的html来"set innerHTML" （例如<div data-reactroot=\\"\\" data-reactid=\\"1\\"><div id=\\"wrapper\\"... ）。 就像整个服务器端的渲染结果都被丢弃一样，此客户端渲染的HTML插入到DOM中，可能导致重新渲染。

测试2 ：校验和无效； 出于目的，我仅在服务器端添加了一些额外的属性。

当然，“ React尝试重用容器中的标记，但校验和无效。” 警告出现。

但是，其他所有内容都与上面的Test1相似！ 类似的时间，还有单个的"set innerHTML"操作。 这为我确认，即使校验和正确，React也会忽略预渲染的标记（因为无论校验和正确与否，它似乎都在相似的时间执行相同的操作）

测试3 ：关闭服务器端渲染； 返回空的安装点容器。

时间约0.2s。 现在唯一真正的区别是，有许多操作，其中大多数操作update attribute或update styles并且一set innerHTML {"node":"<not serializable>","children":[],"html":null,"text":null}带有{"node":"<not serializable>","children":[],"html":null,"text":null} 。

问题/问题

我不知道该怎么想。 React宣传SSR作为加快应用程序引导的一种方式，因为它不需要再次生成DOM树（或者：将其插入文档中；仍然需要呈现它以便比较校验和，对吗？）。 但是对我来说似乎没有任何收获。

成功利用SSR的人可以告诉我他/她在printWasted()和printOperations()什么吗？ 我唯一找到的就是这次审核： https : //github.com/reddit/reddit-mobile/issues/247#issuecomment-118398416 （虽然只有printWasted ）-我的测试都没有显示出printWasted中的任何完整printWasted 。

Answer 1

好了，一切都很简单：升级到React 15.4.2之后， 测试1并没有显示任何操作，正如我最初期望的那样。 因此，最后都是（不是）旧库版本的问题。 但是坐骑的时间仍然非常相似。