如何分析 React（Native）中被动效果的性能

Question

我有一个 React Native 项目，目前正在使用 React Devtools 中的火焰图来研究性能。

现在它告诉我在一些渲染中很多时间都花在了“被动效果”上。示例：

根据 Google 的说法，这些大多与

useEffect

相关。然而，问题是 React Devtools 没有告诉我任何关于 which 效果花费时间最长的信息。鉴于该项目相当大，我不能只是遍历每个

useEffect

并将其时间记录在控制台中。

我觉得很奇怪，这些信息是如此神秘和有限。有没有什么方法可以生成特定渲染的所有被动效果及其时间消耗的列表？

Answer 1

如果您使用 Hermes，我会尝试使用此处的说明：https://github.com/jlfwong/speedscope/wiki/Importing-from-Hermes

分析正在发生的真实 JS 调用，并找出这些调用是从哪里调用的。