Search code examples
reactjsgoogle-chromegoogle-chrome-devtoolsprofiler

Stats for child components are not always available in User-Timing section of chrome performance tab


Below is the screenshot of my attempt to profile some React app.

Screenshot

As you can see, InspectionPage component is selected, but there is no information about children components displayed in the Bottom-Up tab, like, for example, we can see here - https://twitter.com/dan_abramov/status/994577100077191168.

What's weird - it's not always the case. Sometimes it's available and sometimes not given seemingly exact same conditions.


Solution

  • After struggling with this myself, my answer here is the only definite workaround I've been able to find.

    It appears to be an issue with the current stable release of Chrome. Using a newer version of Chrome, such as Chrome Dev or Canary, will allow you to use the breakdown until the update makes its way into a stable release of Chrome.

    Sources: