DevTools React recommendations UI / architecture

[bvaughn]

Up until this point, DevTools has generally presented information without making specific recommendations. For example, the Profiler shows which components are faster or slower, relative to each other, but makes no recommendations about how slow is too slow or when/where memoization should be added.

Some overall architecture and UX for this would probably be good to consider adding to DevTools.

Ideas for things DevTools might warn about:

• undefined return value (could indicate an accidental early return)
• Components that render "too slow" (above some threshold)
• When there is a sync update (e.g. recommend useTransition)
• When memoization (e.g. React.memo or useMemo) might be helpful
• Multi-pass renders

Perhaps we could add an audit mode to check a specific component (or the whole tree) for problems like the ones above.

[tylerkneidl]

This is an amazing idea, I'm just trying to think of some more concepts that could be tested here. How would one even make the decision around how slow is too slow? Would we need to conduct research? Compare it to other components of similar types? Suggest when to use context and reducers? Really fun to think about!