performance GitHub stars Pub version demo badge Twitter Follow

Performance overlay package for Flutter apps that works on web.


Getting started

To use this package, follow the installing guide.


Adding the performance overlay is as simple as wrapping your app in the CustomPerformanceOverlay widget:

return CustomPerformanceOverlay(
  child: child,

You can also disable it on-demand using the enabled parameter:

return CustomPerformanceOverlay(
  enabled: false,
  child: child,

Furthermore, you can also use the following parameters for customization:

  • alignment and scale for alignment and sizing of the overlay.
  • sampleSize, targetFrameTime, and barRangeMax for how the performance data is displayed.
  • backgroundColor, textColor, textBackgroundColor, uiColor, rasterColor, and highLatencyColor for custom theming.

See the CustomPerformanceOverlay class documentation for more information on each of these members.

To understand how to read the charts and limitations, please see the main README on GitHub.