React Native Commits

The scatter plot overlays React commit events on the bar graph, providing insights into how React updates affect frame rendering performance.

Features

• Scatter Points:
  When you hover over scatter points on the graph, you will see labels like this:

  

  These labels display the names of components where state changes occurred in React Native. The state changes signify the starting point of a re-render. All these state changes happen between the previous and next frames in Android. Clicking on a scatter point will open a detailed pop-up.

• Pop-Up:

  

  A pop-up appears as shown on the left. This pop-up provides detailed information, including:

  • Component Name: The name of the component where the state change originated, initiating the re-render.
  • List of Affected Components: A list of child components impacted by the state change in the originating component.