gpt4 book ai didi

javascript - 我如何测量 React 16 中浪费的渲染?

转载 作者:可可西里 更新时间:2023-11-01 02:10:50 29 4
gpt4 key购买 nike

我以前用过 react-addons-perf通过 Perf.printWasted() 测量各种东西的包,比如浪费的渲染。不幸的是,这个包在 React 16 中被淘汰,取而代之的是 Chrome 的 Performance 选项卡,它没有等效的工具。

我知道 why-did-you-update ,但这并不完全相同。

React 16 中有什么方法可以衡量浪费的渲染吗?

最佳答案

是的,react-addons-perf已经退休了,你不会得到它们用于 React 16 和进一步(进入 Fiber),正如 Dan Abramov 在 this issue 中所说的那样.

编辑 09-2018:最近发布了 React DevTools 分析器,现在您可以使用此工具进行渲染优化和分析。关于此工具以及如何使用它的更多信息,请参阅 this official react blog post

编辑 09-2019:React Dev Tools 收到重大更新,现在您可以测量渲染,并且有一个设置可以在RDT 设置。

另一种选择是使用 why-did-you-update ,你提到过,但与 react-perf-addons “不完全相同”的区别在于,后者工具使用内部协调分析,而不是依赖于通过更新状态或父级触发重新渲染这一事实,比如你为什么要更新。对我来说,当我们处理 React 不必要的渲染性能分析时,这些工具之间没有太大区别。

或者,您可以使用在 this issue 中链接的性能表插件.在我看来,article by Ben Schwarz 中概述的性能分析原则将对您和您的应用程序性能最有帮助,因为 React 在内部使用 Timing API,并且它将显示在 Chrome DevTools 中性能选项卡中的“用户计时”下。

希望这对您有所帮助!

关于javascript - 我如何测量 React 16 中浪费的渲染?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47319184/

29 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com