[Impeller] performance issue on specific lottie files. #141961

desmeit · 2024-01-22T12:44:02Z

Steps to reproduce

Install 3.16+ flutter
Install newest lottie 3.0.0 for flutter
take a bit more complex lottie file

Actual results

Under 3.7.12 I had no problems with more complex Lottie files of around 1 MB.
With the update to 3.16 I have the problem that the lotties are jerky and all animations no longer run smoothly. There seems to be a big performance problem with lottie. I have also noticed a similar problem with slightly larger SVG files.

with Lottie:

RPReplay_Final1705926939.MP4

without Lottie:

RPReplay_Final1705926988.MP4

Logs

[✓] Flutter (Channel stable, 3.16.5, on macOS 14.1.2 23B92 darwin-arm64, locale de-DE)
    • Flutter version 3.16.5 on channel stable at /Users/xxx/development/tools/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 78666c8dc5 (vor 5 Wochen), 2023-12-19 16:14:14 -0800
    • Engine revision 3f3e560236
    • Dart version 3.2.3
    • DevTools version 2.28.4

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /Users/xxx/Library/Android/sdk
    • Platform android-34, build-tools 34.0.0
    • ANDROID_HOME = /Users/xxx/Library/Android/sdk
    • ANDROID_SDK_ROOT = /Users/xxx/Library/Android/sdk
    • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b829.9-10027231)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 15.0.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 15A507
    • CocoaPods version 1.14.3

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2022.3)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • android-studio-dir = /Applications/Android Studio.app
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b829.9-10027231)

[✓] VS Code (version 1.85.2)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.80.0

[✓] Connected device (3 available)
    • xxx iPhone (mobile) • 00008130-000A49440230001C • ios            • iOS 17.2.1 21C66
    • macOS (desktop)         • macos                     • darwin-arm64   • macOS 14.1.2 23B92 darwin-arm64
    • Chrome (web)            • chrome                    • web-javascript • Google Chrome 120.0.6099.234
    ! Error: Browsing on the local area network for xxx iPhone. Ensure the device is unlocked and attached with a cable or associated with the same local area
      network as this Mac.
      The device must be opted into Developer Mode to connect wirelessly. (code -27)

[✓] Network resources
    • All expected network resources are available.

• No issues found!

Flutter Doctor output

Doctor output

[✓] Flutter (Channel stable, 3.16.5, on macOS 14.1.2 23B92 darwin-arm64, locale de-DE)
    • Flutter version 3.16.5 on channel stable at /Users/xxx/development/tools/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 78666c8dc5 (vor 5 Wochen), 2023-12-19 16:14:14 -0800
    • Engine revision 3f3e560236
    • Dart version 3.2.3
    • DevTools version 2.28.4

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /Users/xxx/Library/Android/sdk
    • Platform android-34, build-tools 34.0.0
    • ANDROID_HOME = /Users/xxx/Library/Android/sdk
    • ANDROID_SDK_ROOT = /Users/xxx/Library/Android/sdk
    • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b829.9-10027231)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 15.0.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 15A507
    • CocoaPods version 1.14.3

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2022.3)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • android-studio-dir = /Applications/Android Studio.app
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b829.9-10027231)

[✓] VS Code (version 1.85.2)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.80.0

[✓] Connected device (3 available)
    • xxx iPhone (mobile) • 00008130-000A49440230001C • ios            • iOS 17.2.1 21C66
    • macOS (desktop)         • macos                     • darwin-arm64   • macOS 14.1.2 23B92 darwin-arm64
    • Chrome (web)            • chrome                    • web-javascript • Google Chrome 120.0.6099.234
    ! Error: Browsing on the local area network for xxx iPhone. Ensure the device is unlocked and attached with a cable or associated with the same local area
      network as this Mac.
      The device must be opted into Developer Mode to connect wirelessly. (code -27)

[✓] Network resources
    • All expected network resources are available.

• No issues found!

appinteractive · 2024-01-22T14:15:46Z

We experience the exact same issue after upgrading from 3.10. it's janky on all versions between 3.13 and 3.19. Newer version of Lottie (3.0) does not help either.

appinteractive · 2024-01-22T16:01:49Z

related #140257

huycozy · 2024-01-23T06:06:23Z

Hi @desmeit
For us to further investigate this issue, please provide a completed and minimal reproducible code sample that doesn’t include 3rd party plugins or complex production code so that we may verify this.

Also, could you check if this issue persists without using Impeller?

desmeit · 2024-01-23T14:00:57Z

Hi @huycozy,

thanks for your feedback. Here you can find the minimal example: https://we.tl/t-sparN7Z567
I tested it also without impeller and it looks much better.

huycozy · 2024-01-24T04:47:54Z

Thanks for the update. I checked this on both iOS and Android app and the results as below. Janks and rasters are observed when disabling Impeller as well (it's less on iOS, though)

iOS (iPhone 7, iOS 15.8)

With Impeller:
- Timeline trace json: dart_devtools_2024-01-24_11_13_52.060.json
Without Impeller:
- Timeline trace json: dart_devtools_2024-01-24_11_33_02.362.json

Android (Pixel 7, Android 14)

Without Impeller:
With Impeller:

flutter doctor -v (stable and master)

[✓] Flutter (Channel stable, 3.16.8, on macOS 14.1 23B74 darwin-x64, locale en-VN)
    • Flutter version 3.16.8 on channel stable at /Users/huynq/Documents/GitHub/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 67457e669f (27 hours ago), 2024-01-16 16:22:29 -0800
    • Engine revision 6e2ea58a5c
    • Dart version 3.2.5
    • DevTools version 2.28.5

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /Users/huynq/Library/Android/sdk
    • Platform android-34, build-tools 34.0.0
    • ANDROID_HOME = /Users/huynq/Library/Android/sdk
    • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b802.4-9586694)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 15.0.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 15A507
    • CocoaPods version 1.14.3

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2023.1)
    • Android Studio at /Applications/Android Studio Hedgehog.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 17.0.7+0-17.0.7b1000.6-10550314)

[✓] Android Studio (version 2022.2)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • android-studio-dir = /Applications/Android Studio.app/
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b802.4-9586694)

[✓] VS Code (version 1.85.1)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.80.0

[✓] Connected device (3 available)
    • iPhone (mobile) • d9a94afe2b649fef56ba0bfeb052f0f2a7dae95e • ios            • iOS 15.8 19H370
    • macOS (desktop) • macos                                    • darwin-x64     • macOS 14.1 23B74 darwin-x64
    • Chrome (web)    • chrome                                   • web-javascript • Google Chrome 120.0.6099.234

[✓] Network resources
    • All expected network resources are available.

• No issues found!

[!] Flutter (Channel master, 3.19.0-9.0.pre.50, on macOS 14.1 23B74 darwin-x64, locale en-VN)
    • Flutter version 3.19.0-9.0.pre.50 on channel master at /Users/huynq/Documents/GitHub/flutter_master
    ! Warning: `flutter` on your path resolves to /Users/huynq/Documents/GitHub/flutter/bin/flutter, which is not inside your current Flutter SDK checkout at /Users/huynq/Documents/GitHub/flutter_master. Consider adding /Users/huynq/Documents/GitHub/flutter_master/bin to the front of your path.
    ! Warning: `dart` on your path resolves to /Users/huynq/Documents/GitHub/flutter/bin/dart, which is not inside your current Flutter SDK checkout at /Users/huynq/Documents/GitHub/flutter_master. Consider adding /Users/huynq/Documents/GitHub/flutter_master/bin to the front of your path.
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 5dea6b994e (10 hours ago), 2024-01-21 12:01:23 -0500
    • Engine revision a7b207d5a1
    • Dart version 3.4.0 (build 3.4.0-52.0.dev)
    • DevTools version 2.31.0
    • If those were intentional, you can disregard the above warnings; however it is recommended to use "git" directly to perform update checks and upgrades.

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /Users/huynq/Library/Android/sdk
    • Platform android-34, build-tools 34.0.0
    • ANDROID_HOME = /Users/huynq/Library/Android/sdk
    • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b802.4-9586694)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 15.0.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 15A507
    • CocoaPods version 1.14.3

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2023.1)
    • Android Studio at /Applications/Android Studio Hedgehog.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 17.0.7+0-17.0.7b1000.6-10550314)

[✓] Android Studio (version 2022.2)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • android-studio-dir = /Applications/Android Studio.app/
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b802.4-9586694)

[✓] VS Code (version 1.85.2)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.80.0

[✓] Connected device (2 available)
    • macOS (desktop) • macos  • darwin-x64     • macOS 14.1 23B74 darwin-x64
    • Chrome (web)    • chrome • web-javascript • Google Chrome 120.0.6099.234
    ! Error: iPhone has recently restarted. Xcode will continue when iPhone is unlocked. (code -14)

[✓] Network resources
    • All expected network resources are available.

! Doctor found issues in 1 category.

appinteractive · 2024-01-24T09:43:12Z

We experience the same issues with multiple small Lottie files too. Do it's not limited to single large files.

jonahwilliams · 2024-01-29T20:30:45Z

Similar to existing lottie performance issues: tessellation overhead is substantial.

See #137714 for the effort to fix this

jonahwilliams · 2024-01-29T20:30:58Z

FYI @zanderso

zanderso · 2024-01-30T16:49:59Z

FYI @bdero thought this might be interesting to validate StC work when it is closer to completion, but if you already have some examples in mind, then that is fine, too.

jonahwilliams · 2024-02-11T22:03:11Z

@desmeit can you upload that project somewhere like Github where the link won't expire. I'm going back to check on some changes we're making but now I can no longer find this project.

desmeit · 2024-02-12T07:41:53Z

@jonahwilliams

https://github.com/desmeit/testlottie

desmeit · 2024-02-20T11:11:20Z

@jonahwilliams

Just one question:

While we wait for the fix, is it possible to build the app without impeller?

Of course I know
flutter run --no-enable-impeller

But is it also possible to build the release in the old way with SkSL warmup?

zanderso · 2024-02-20T16:21:05Z

@desmeit instructions are under https://docs.flutter.dev/perf/impeller#availability.

desmeit · 2024-02-21T09:17:50Z

thanks. Warmup ist also working with this tag.

…dering. (#50856) Turn the page, wash your hands. Addresses the following issues: * flutter/flutter#143077 * flutter/flutter#137714 * flutter/flutter#138460 * flutter/flutter#123671 * flutter/flutter#141961 * flutter/flutter#134432

…dering. (flutter#50856) Turn the page, wash your hands. Addresses the following issues: * flutter/flutter#143077 * flutter/flutter#137714 * flutter/flutter#138460 * flutter/flutter#123671 * flutter/flutter#141961 * flutter/flutter#134432

…dering. (#51209) Turn the page, wash your hands. Addresses the following issues: * flutter/flutter#143077 * flutter/flutter#137714 * flutter/flutter#138460 * flutter/flutter#123671 * flutter/flutter#141961 * flutter/flutter#134432 Previous attempt: - #50856 - reverted with #51191 - fixed with #51198

… path rendering. (#51209)" (#51217) Reverts #51209 Initiated by: bdero Reason for reverting: Golden breakages on [engine roll](flutter/flutter#144647) https://flutter-gold.skia.org/search?issue=144647&crs=github&patchsets=5&corpus=flutter Original PR Author: bdero Reviewed By: {jonahwilliams, chinmaygarde} This change reverts the following previous change: Original Description: Turn the page, wash your hands. Addresses the following issues: * flutter/flutter#143077 * flutter/flutter#137714 * flutter/flutter#138460 * flutter/flutter#123671 * flutter/flutter#141961 * flutter/flutter#134432 Previous attempt: - #50856 - reverted with #51191 - fixed with #51198

…dering. (flutter#51209) Turn the page, wash your hands. Addresses the following issues: * flutter/flutter#143077 * flutter/flutter#137714 * flutter/flutter#138460 * flutter/flutter#123671 * flutter/flutter#141961 * flutter/flutter#134432 Previous attempts: 1. flutter#50856 - reverted with flutter#51191 - fixed with flutter#51198 2. flutter#51209 - reverted with flutter#51217 - fixed with flutter#51218

…dering. (#51219) Turn the page, wash your hands. Addresses the following issues: * flutter/flutter#143077 * flutter/flutter#137714 * flutter/flutter#138460 * flutter/flutter#123671 * flutter/flutter#141961 * flutter/flutter#134432 Previous attempts: 1. #50856 - reverted with #51191 - fixed with #51198 2. #51209 - reverted with #51217 - fixed with #51218

jonahwilliams · 2024-03-06T18:23:11Z

Before

After

appinteractive · 2024-03-08T07:21:49Z

Awesome 👏 when can the update be expected to land? 🛬

zanderso · 2024-03-08T16:16:19Z

@appinteractive It's available on the master channel now, and should be in the April beta release, and Q2 stable release, exact dates TBA.

bdero · 2024-04-02T18:19:31Z

This performance gap was fixed with stencil-then-cover. See also: #143077

github-actions · 2024-04-17T05:00:44Z

This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.

appinteractive mentioned this issue Jan 22, 2024

[Impeller] InternalFlutterGpu_Texture_AsImage crash on older iOS devices using Lottie animations #140710

Closed

huycozy added the in triage Presently being triaged by the triage team label Jan 23, 2024

huycozy added the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label Jan 23, 2024

github-actions bot removed the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label Jan 23, 2024

huycozy changed the title ~~Big performance issue with Lottie and 3.16~~ Big performance issue with complex Lottie files of around 1 MB Jan 24, 2024

jonahwilliams added P1 High-priority issues at the top of the work list and removed c: regression It was better in the past than it is now engine flutter/engine repository. See also e: labels. labels Jan 29, 2024

jonahwilliams self-assigned this Jan 29, 2024

jonahwilliams changed the title ~~Big performance issue with complex Lottie files of around 1 MB~~ [Impeller] performance issue on specific lottie files. Jan 29, 2024

jonahwilliams added the triaged-engine Triaged by Engine team label Jan 29, 2024

jonahwilliams removed their assignment Jan 29, 2024

jonahwilliams added P2 Important issues not at the top of the work list and removed P1 High-priority issues at the top of the work list labels Jan 29, 2024

mdmm13 mentioned this issue Feb 2, 2024

Performance issues greensopinion/flutter-vector-map-tiles#120

Open

jonahwilliams mentioned this issue Feb 7, 2024

[Impeller] ☂️ Path drawing performance needs significant improvement. #143077

Closed

15 tasks

jonahwilliams mentioned this issue Feb 12, 2024

[Impeller] Cache tessellated data on impeller::Path objects. flutter/engine#50503

Closed

bdero mentioned this issue Feb 22, 2024

[Impeller] Enable depth buffer clipping & Stencil-then-Cover path rendering. flutter/engine#50856

Merged

bdero mentioned this issue Mar 5, 2024

[Impeller] Enable depth buffer clipping & Stencil-then-Cover path rendering. flutter/engine#51209

Merged

auto-submit bot mentioned this issue Mar 5, 2024

Reverts "[Impeller] Enable depth buffer clipping & Stencil-then-Cover path rendering. (#51209)" flutter/engine#51217

Merged

bdero mentioned this issue Mar 6, 2024

[Impeller] Enable depth buffer clipping & Stencil-then-Cover path rendering. flutter/engine#51219

Merged

bdero closed this as completed Apr 2, 2024

huycozy added the r: fixed Issue is closed as already fixed in a newer version label Apr 3, 2024

github-actions bot locked as resolved and limited conversation to collaborators Apr 17, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Impeller] performance issue on specific lottie files. #141961

[Impeller] performance issue on specific lottie files. #141961

desmeit commented Jan 22, 2024 •

edited

appinteractive commented Jan 22, 2024

appinteractive commented Jan 22, 2024

huycozy commented Jan 23, 2024

desmeit commented Jan 23, 2024

huycozy commented Jan 24, 2024

appinteractive commented Jan 24, 2024 •

edited

jonahwilliams commented Jan 29, 2024

jonahwilliams commented Jan 29, 2024

zanderso commented Jan 30, 2024

jonahwilliams commented Feb 11, 2024

desmeit commented Feb 12, 2024

desmeit commented Feb 20, 2024 •

edited

zanderso commented Feb 20, 2024

desmeit commented Feb 21, 2024

jonahwilliams commented Mar 6, 2024

appinteractive commented Mar 8, 2024

zanderso commented Mar 8, 2024

bdero commented Apr 2, 2024

github-actions bot commented Apr 17, 2024

[Impeller] performance issue on specific lottie files. #141961

[Impeller] performance issue on specific lottie files. #141961

Comments

desmeit commented Jan 22, 2024 • edited

Steps to reproduce

Actual results

Logs

Flutter Doctor output

appinteractive commented Jan 22, 2024

appinteractive commented Jan 22, 2024

huycozy commented Jan 23, 2024

desmeit commented Jan 23, 2024

huycozy commented Jan 24, 2024

iOS (iPhone 7, iOS 15.8)

Android (Pixel 7, Android 14)

appinteractive commented Jan 24, 2024 • edited

jonahwilliams commented Jan 29, 2024

jonahwilliams commented Jan 29, 2024

zanderso commented Jan 30, 2024

jonahwilliams commented Feb 11, 2024

desmeit commented Feb 12, 2024

desmeit commented Feb 20, 2024 • edited

zanderso commented Feb 20, 2024

desmeit commented Feb 21, 2024

jonahwilliams commented Mar 6, 2024

Before

After

appinteractive commented Mar 8, 2024

zanderso commented Mar 8, 2024

bdero commented Apr 2, 2024

github-actions bot commented Apr 17, 2024

desmeit commented Jan 22, 2024 •

edited

appinteractive commented Jan 24, 2024 •

edited

desmeit commented Feb 20, 2024 •

edited