React DevTool突出显示组件及其工作方式

时间:2018-09-12 18:17:32

标签: reactjs

TLDR;为什么React DevTool的突出显示选项将子组件的父级已经标记为“更新”,从而将子组件标记为“正在更新”?

我有一个小型的React App,可以从服务器上获取数据并将其设置为state。视图将按预期更新,并且一切正常。

当我尝试追踪哪些组件被更新时,我发现自己很困惑,因为不仅在React DevTools中父级被标记为“更新中”,而且子级也被标记为“正在更新”。我希望仅将父级标记为“正在更新”,因为标记父级似乎是多余的(据我所知,重新渲染的父级意味着所有子级都在进行重新渲染)

尽管如此,我还是意识到我仍然需要对子组件进行一些改进,所以我坐下来并明智地清理了代码性能。

当我这样做时,我面临着下一个惊喜。当我再次检查DevTools中的“更新”组件时,我发现现在我的孩子不再被标记为“更新”了。但是,父母仍然是我所期望的。

我现在的问题是: 我是否取得了性能上的进步? ?孩子们不再被标记为“正在更新”,而父辈仍然被标记为“正在更新”,这意味着孩子们无论如何都要更新,对吗?

澄清将不胜感激! :)

0 个答案:

没有答案