performancefluttergoogle-mapswebviewslidingdrawer

Flutter webview_plugin performance implications


The Flutter web team says that for the moment HTML documents are better for (dressing) large bodies of text than dressing with the Flutter Widget framework, Flutter excel at programmatic apps.

So I have a large amount of text & pictures & animations, which would benefit from HTML's dressing & flexibility, but there are elements I want to program.

The Flutter youtube teaching team says that Webview touch events are deprioritised when using Flutter's webview plugin, this could result in jank on scrolling or latency on HTML css buttons responding, or latency on CSS or SVG Smil animations firing. A bad user experience.

The HTML files would mostly be kept in my apps asset folder on the device. Does anyone have some guidelines to maximise performance when working with Flutter webviews?

The ideal user experience would be a GoogleMap, tap a marker, and a SlidingPanel rides up, with a few native Flutter buttons as a header, below which is a very tall webView with lots of HTML.


Solution

  • In my experience at least, having just emerged from some of this, when a webview is what the user is interacting with flutter uses almost no cpu. (I'm not sure if many touch events change this equation much). But it is easy to write a poor performing flutter widget tree. Since we tend to make widget trees more and more complex to do what looks right, and then check for performance at the end, and then discover performance is poor, there isn't much that can be done. A complex widget tree that isn't getting events and repainting, is ok, of course.

    A web view can be confined to any size and if there is no overlap/interactin with flutter widgets then I think whatever goes on in the web view is not triggering cpu elsewhere on the page. So there is no benefit to making a webview full screen.