0
302
ViewsWhat does the hook numbers in the Reactjs Dev tool correspond to?
I have a react.js app that I want to profile for performance issues.
I'm using the react dev tool profiler in firefox.
I profile a specific interaction and get the flamegraph and the ranked time graph in the dev tool.
Then this message shows up in the dev tool:
This part of the dev tool is not interactive, and I can't find anything on how the hooks are numbered.
How do I interpret these numbers? What do they correspond to? Where can I find the information on what hooks they refer to?
1 answers
Answer question0
This is the PR where they added that feat. They didn't provide a better UI due to some performance constraints. But you can find what hooks those indexes correspond to if you go to the components tab in dev tools and inspect said component; in the hooks section, you'll have a tree of the called hooks, and for each hook, a small number at the left which is the index. You'll probably need to unfold the tree of hooks to find them.
Here's a screenshot from the linked PR
