Description
Right now when working on a large project/component tree it can be difficult to understand why a large subtree is re-rendering. You click on each component and a reason: 1) Re-rendered because of the parent, 2) Re-rendered because a property changed, 3) Re-rendered because a hook changed. We don't get notified if a context value changed but ideally we would in the future.
If the flamegraph added icons we could perhaps spot patterns and more quickly identify what's going on when a large tree re-renders. For example state is changed (📚) at the top causing components to re-render via props (📋). Here's an example
📚Parent View
📋 TabStrip
📋 Page
📚Content
📋 Story
Here we can quickly spot that the state is changing in two component, and 3 components are changing because of prop. That might focus the investigation into why the state of Parent View / Content are changing which are likely causing the other props to change.