component/hook reuse report

[charlieforward9]

Describe the feature

I have been building react now for two years. For much of this time, I figured I could have one hook per module that serves all the components, putting ALL of the api's / helper methods / state variables , etc related to the module within the same hook.

I now know that is NOT how it should be done, after doing a bit of research, and that hooks should generally be granular.

I could probably communicate this better if more information is requested, but I was wondering if these hook/component instances could be tracked and portrayed somehow on the Million dashboard to give developers an understanding of how much memory is being allocated to these layers of the React tree.

If this is unrelated to this project, please help me understand where this could fit into the react dev tools that exist today.

Thanks!

Additional information

• Would you be willing to help implement this feature?

[github-actions]

Thanks for opening this issue! A maintainer will review it soon.

[aidenybai]

@charlieforward9 the difficult part of implementing this is that custom hooks are just functions in reality. Like you could name it function wooHoo() {} and it would still work. We're able to count the # of executions, but not the actual instances.

I'm interested in your dashboard idea - up for a chat? https://cal.com/aiden (sched the 1 hr option)

[charlieforward9]

@aidenybai finally found some free time to contribute and discuss open source.

I'll put myself on for the earliest I can. Just adding this for a little heads up to you.

See ya soon!

[charlieforward9]

Will start experimenting on react scan and reopen this with more specificity if needed.