反应检查组件重新渲染多少次

Question

我正在做一些事情，我的代码有些慢，我认为发生的是该组件无缘无故地渲染了太多次。 是否有任何方法可以检查组件在响应（或对此问题为响应本机）中重新渲染多少次？ 我试图做的是在render方法后面放一个console.log并计算有多少，但是我不确定那是否可行。 预先感谢！

Answer 1

如果将

console.log置于渲染函数中，则它将起作用。如果您担心组件重新渲染过多，请尝试扩展React.PureComponent。有关PureComponent的信息可以在React's docs中找到。您还可以查看shouldComponentUpdate方法，以查看这是否有助于解决您的重新渲染。 their docs中也提供了有关此信息。祝你好运！

Answer 2

比在每个组件中放置console.log更好的是使用此小型工具

https://github.com/maicki/why-did-you-update

每次不必要地重新渲染组件时（例如，道具或状态都没有更改），都会在控制台中警告您

即使不再维护，它仍然可以完美运行。

最诚挚的问候

Answer 3

您可以将console.count('counter')放在渲染函数中进行检查。在这里，您会找到有关 console.count link

的所有详细信息