Debug performance for web apps

The Flutter framework emits timeline events as it works to build frames, draw scenes, and track other activity such as garbage collections. These events are exposed in the Chrome DevTools performance panel for debugging.

You can also emit your own timeline events using the dart:developer Timeline and TimelineTask APIs for further performance analysis.

Screenshot of the Chrome DevTools performance panel

Optional flags to enhance tracing


To configure which timeline events are tracked, set any of the following top-level properties to true in your app's main method.


  1. [Optional] Set any desired tracing flags to true from your app's main method.
  2. Run your Flutter web app in profile mode.
  3. Open up the Chrome DevTools Performance panel for your application, and start recording to capture timeline events.