Improving rendering performance

Rendering animations in your app is one of the most cited topics of interest when it comes to measuring performance. Thanks in part to Flutter's Skia engine and its ability to quickly create and dispose of widgets, Flutter applications are performant by default, so you only need to avoid common pitfalls to achieve excellent performance.

General advice

#

If you see janky (non-smooth) animations, make sure that you are profiling performance with an app built in profile mode. The default Flutter build creates an app in debug mode, which is not indicative of release performance. For information, see Flutter's build modes.

A couple common pitfalls:

  • Rebuilding far more of the UI than expected each frame. To track widget rebuilds, see Show performance data.
  • Building a large list of children directly, rather than using a ListView.

For more information on evaluating performance including information on common pitfalls, see the following docs:

Mobile-only advice

#

Do you see noticeable jank on your mobile app, but only on the first run of an animation? If so, see Reduce shader animation jank on mobile.

Web-only advice

#

The following series of articles cover what the Flutter Material team learned when improving performance of the Flutter Gallery app on the web: