我一直在使用 react-devtools 来检测任何不必要的组件更新，但是我不确定我是否完全理解它是如何工作的。
我可以识别通过添加的边框更新的各种组件，表明它们已更新，但我不确定这些边框的各种颜色是什么意思（到目前为止，我已经看到了青色和浅绿色）。
问问题
3541 次
1 回答
20
我也不熟悉这个，但我会跟踪代码！:)
这是呈现“突出显示更新”切换的组件。它调用changeTraceUpdatesmainStore中的一个方法，该方法通过“桥”发送消息以激活TraceUpdatesBackendManager. 浏览该文件，我们看到几个类，其中包含“presenter”之类的名称；我认为其中之一是实际绘制边界的内容。特别是，TraceUpdatesWebNodePresenter看起来相关，因为它定义了一个COLORS. 看起来这些颜色是根据“hit”属性选择的，快速搜索表明该属性由TraceUpdatesAbstractNodePresenter- 设置，并且每次“呈现”元素时都会增加。
然后在字里行间阅读，我假设这意味着渲染频率较低的组件将用“冷”颜色（蓝色）勾勒出来，而渲染频率更高的组件将用“热”颜色（红色）勾勒出来。
于 2018-08-02T14:27:16.860 回答