Flutter animation is not smooth at first time render

This is a known issue in flutter where you have to "warm-up" the graphic api (SkSL) first. After a third run, usually it will become smooth.

The problem happens in both iOS an Android.

For iSO, the lag usually occurs in metal api as Apple has recently dropped support for OpenGL which is usually where the Skia graphic engine is implemented.

Work around and temporary solution are found on this page.

Extreme jank on iOS/Android the first time any kind of animation or transition runs (release build) - skia shader compilation #61450

Update

Flutter has updated their official docs on this issue

Reduce shader compilation jank on mobile


You need to build with --release or --profile. If you run from IDE you'll get a --debug build by default, which is unsuitable to measure any performance metrics or animations or build output size.

flutter run --profile

More details in https://flutter.io/docs/testing/ui-performance

Tags:

Flutter