how to find performance issue and fix in flutter

Question

I am using dart to develop a flutter(version 1.22.5) app, in my Android Studio(version 4.1.2), I found some frame render very slow(60 frame/s is good, now only 1/2) like this:

but the problem is, I do not know where make the render slow, how to find the performance issue? I know it slow, but where? what should I do to find it out? Is there any tips?

question from:https://stackoverflow.com/questions/65879341/how-to-find-performance-issue-and-fix-in-flutter

Answer 1

First you should apply Flutter performance best practices. After reading it you will probably optimize a few things.

Then you can check with Flutter performance profiling

The overlay should always be viewed in profile mode, since debug mode performance is intentionally sacrificed in exchange for expensive asserts that are intended to aid development, and thus the results are misleading.

When both graphs display red, start by diagnosing the UI thread.

In short it often comes mainly from non cached images, UI animation, etc

Also if GPU bar is high, it might be an algorithm issue (like the way you coded your raytracer is not optimized).

If you still have issue with performance you can try to run your app with SkSL warm-up