flutter / flutter

Flutter makes it easy and fast to build beautiful apps for mobile and beyond
https://flutter.dev
BSD 3-Clause "New" or "Revised" License
166.15k stars 27.47k forks source link

Webview lag on android #74894

Open fbeccaceci opened 3 years ago

fbeccaceci commented 3 years ago

Details

Target Platform: android Devices: Huawei p20 lite (android version 9)

I'm having a problem using the official webview plugin on android (on ios everything is fine), the webview really lag if you scroll, i also tried enabling Hybrid composition, this solve the problem with the webview which works fine but make the entire app lag

there is my code: https://gist.github.com/fbeccaceci/f706024fe311470336ed516531fbbe4b

https://user-images.githubusercontent.com/32967519/106151447-a6f75c80-617c-11eb-907f-0c10f7293ea4.mp4

https://user-images.githubusercontent.com/32967519/106151866-1e2cf080-617d-11eb-96d1-3bbd841470d6.mp4

Logs

Logs ``` ``` Flutter doctor output: [✓] Flutter (Channel stable, 1.22.5, on macOS 11.1 20C69 darwin-x64, locale it-IT) • Flutter version 1.22.5 at /Users/ipla/flutter • Framework revision 7891006299 (7 settimane fa), 2020-12-10 11:54:40 -0800 • Engine revision ae90085a84 • Dart version 2.10.4 [!] Android toolchain - develop for Android devices (Android SDK version 30.0.2) • Android SDK at /Users/ipla/Library/Android/sdk • Platform android-30, build-tools 30.0.2 • ANDROID_HOME = /Users/ipla/Library/Android/sdk • Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b3-6222593) ✗ Android license status unknown. Run `flutter doctor --android-licenses` to accept the SDK licenses. See https://flutter.dev/docs/get-started/install/macos#android-setup for more details. [✓] Xcode - develop for iOS and macOS (Xcode 12.4) • Xcode at /Applications/Xcode.app/Contents/Developer • Xcode 12.4, Build version 12D4e • CocoaPods version 1.10.0 [!] Android Studio (version 4.0) • Android Studio at /Applications/Android Studio.app/Contents ✗ Flutter plugin not installed; this adds Flutter specific functionality. ✗ Dart plugin not installed; this adds Dart specific functionality. • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b3-6222593) [!] IntelliJ IDEA Ultimate Edition (version 2020.2.3) • IntelliJ at /Applications/IntelliJ IDEA.app ✗ Flutter plugin not installed; this adds Flutter specific functionality. ✗ Dart plugin not installed; this adds Dart specific functionality. • For information about installing plugins, see https://flutter.dev/intellij-setup/#installing-the-plugins [✓] VS Code (version 1.52.1) • VS Code at /Applications/Visual Studio Code.app/Contents • Flutter extension version 3.18.1 [✓] Connected device (1 available) • ANE LX1 (mobile) • 9WV7N18903002636 • android-arm64 • Android 9 (API 28) ! Error: iPhone di Fabrizio is not connected. Xcode will continue when iPhone di Fabrizio is connected. (code -13) ! Doctor found issues in 3 categories. ``` ```
pedromassangocode commented 3 years ago

Hi @fbeccaceci Just by looking at your videos I cannot notice any lag. Can you please be more clear at which point it lags? It would probably be better to verify performance issues using DevTools! Thank you

fbeccaceci commented 3 years ago

Focus on the scroll of the website, in the Hybrid Composition one it's smooth as it's supposed to be, on the Virtual display one it's laggy and definitely not smooth. At the same time if you focus on the drawer animation it's fine in the virtual display example, while with hybrid composition enable it is noticeable under 60 fps

eness commented 3 years ago

same problem here. webview lags when you scroll the page down or up, even the DOM is not that complicated or so long. The smoothing experience definitely not same when comparing to the native scrolling functionality.

pruthvi-itribe commented 1 year ago

Any update on this ?

pruthvi-itribe commented 1 year ago

We have embedded a react app using webview in flutter and can see the lag where its default scroll of html css elements but its gives very bad experience to users in app. whereas web version of this is working fine in mobiles. https://user-images.githubusercontent.com/92719921/206704806-fe1e1333-8388-4f38-b3ec-5f399f529d0d.mp4