Flutter app slow

Question

I'm trying out Flutter and my app is responding very very slow on both the emulator and real device. I get warnings like this

Skipped 51 frames! The application may be doing too much work on its main thread.

I'm aware Dart is a single-threaded programming language and in Android I used to solve this with the good old new Thread(); block for async. I am trying to apply the same in Flutter and I reading through Future await async and the sorts but the examples seem to be addressing when you reading data from the internet. My app doesn't read anything online at this stage, I'm getting Skipped x frames when my screen has progress dialog, when I am opening a new screen/page, and with every animation on the app. Here is an example of the class where I am getting the issue:

_buildContent(){
    return new Column(
      crossAxisAlignment: CrossAxisAlignment.center,
      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[
        new InkWell(
          onTap: (){
            Navigator.push(context, new MaterialPageRoute(builder:
                (context) => new LoginScreen()));
          },
          child: new Container(
            height: 150.0,
            width: 150.0,
            child: new Image.asset("images/logo.png", fit: BoxFit.cover,),
          ),
        ),
        new Container(
          margin: const EdgeInsets.all(16.0),
          child: new CircularProgressIndicator(
              value: null,
              strokeWidth: 1.0,
              valueColor: new AlwaysStoppedAnimation<Color>(
                  Colors.white
              )
          ),
        )
      ],
    );
  }

I'm assuming the skipped x frames warning is caused by the progress dialog? I have another screen (Login Screen) which animates widgets into place when opened, the animations move so slow, I can literally see each frame being rendered. Is there a tutorial online that can assist with addressing this or just understanding Dart's Asynchronous Programming?

Performance should be checked in release builds flutter build apk --release. Bigger images in animated widgets are known to cause performance issues. — Günter Zöchbauer
@spongyboxx this dialog shouldn't cause performance problem. You most likely have something that cost you a lot somewhere else. Try to use Observatory to trace what's costing that much. — Rémi Rousselet
And remember that futures aren't on a specific thread. They are just executed later on the main thread. So if you do expensive calculation inside a Future, it'll freeze your app — Rémi Rousselet
As both Gunter and Remi mentioned, Future is not a thread. — matanlurey

changhao cui changhao cui · Accepted Answer · 2018-12-19T04:06:34

debug mode

launch is slow
blink when launch
app size big.

because debug mode with Hot reloads.

when you create release apk https://flutter.io/docs/deployment/android

you can find

fast launch
no blink during the launch
app size small (but bigger than the normal android app)

EDIT

https://flutter.io/docs/testing/ui-performance#debug-flags

Debug mode enables additional checks (such as asserts) that don’t run in profile or release builds, and these checks can be expensive. Debug mode also executes code in a different way than release mode. The debug build compiles the Dart code “just in time” (JIT) as the app runs, but profile and release builds are pre-compiled to native instructions (also called “ahead of time”, or AOT) before the app is loaded onto the device. JIT can cause the app to pause for JIT compilation, which itself can cause jank.

https://github.com/flutter/flutter/wiki/Flutter%27s-modes

Debug mode on device (including simulators, emulators): Turns on all the assertions in the world, includes all debugging information, enables all the debugger aids (e.g. observatory) and service extensions. Optimizes for fast develop/run cycles. Does not optimize for execution speed, binary size, or deployment. Used by flutter run. Built with sky/tools/gn --android or sky/tools/gn --ios. Also sometimes called "checked mode" or "slow mode".

Flutter app slow

7 Answers