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
164.93k stars 27.17k forks source link

Images flicker in Safari when scrolling #48373

Closed indigothm closed 4 years ago

indigothm commented 4 years ago

Steps to Reproduce

The website: https://velmio-web.web.app Each image is loaded from firebase using Image.network and a direct URL.

So when the page loads and the images load scrolling the page seems to reset the images. This doesn't happen in Chrome or Firefox.

Target Platform: Web Target OS version/browser: Safari 13 Devices: MacBook Pro

Logs

Flutter (Channel beta, v1.12.13+hotfix.6, on Mac OS X 10.15.1 19B88, locale en-AU)
    • Flutter version 1.12.13+hotfix.6 at /Users/thm/Development/flutter
    • Framework revision 18cd7a3601 (4 weeks ago), 2019-12-11 06:35:39 -0800
    • Engine revision 2994f7e1e6
    • Dart version 2.7.0

[✗] Android toolchain - develop for Android devices
    ✗ Unable to locate Android SDK.
      Install Android Studio from: https://developer.android.com/studio/index.html
      On first launch it will assist you in installing the Android SDK components.
      (or visit https://flutter.dev/setup/#android-setup for detailed instructions).
      If the Android SDK has been installed to a custom location, set ANDROID_HOME to that location.
      You may also want to add it to your PATH environment variable.

[✓] Xcode - develop for iOS and macOS (Xcode 11.3)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 11.3, Build version 11C29
    • CocoaPods version 1.8.4

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

[!] Android Studio (not installed)
    • Android Studio not found; download from https://developer.android.com/studio/index.html
      (or visit https://flutter.dev/setup/#android-setup for detailed instructions).

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

[✓] Connected device (3 available)
    • iPhone 8   • DDC9D4B0-5AA4-4D9C-81BF-277CE567AF20 • ios            • com.apple.CoreSimulator.SimRuntime.iOS-13-3 (simulator)
    • Chrome     • chrome                               • web-javascript • Google Chrome 79.0.3945.88
    • Web Server • web-server                           • web-javascript • Flutter Tools
viduthalai commented 4 years ago

am facing this issue in Chrome as well.
I have reproduced this issue in Flutter's shrine web app also.

Constans commented 4 years ago

@viduthalai , in Chrome it happens only when the dev tools are opened (very unlikely scenario for end-users).

In Safari it still happens for:

Flutter 1.13.9-pre.59 • channel master • https://github.com/flutter/flutter.git
Framework • revision ab36346af6 (22 hours ago) • 2020-01-11 14:20:05 -0500
Engine • revision 3d37d39d95
Tools • Dart 2.8.0 (build 2.8.0-dev.0.0 395daaa3ec)
rpk98c commented 4 years ago

Experiencing same issue. Chrome with devtools open, or Safari all the time images flickering in and out. Can reproduce for dev and release builds.

Constans commented 4 years ago

Indeed, the experience on Safari on a macOS laptop is quite far from that on Chrome, Firefox, and Opera. Luckily is not flickering on phones and tablets (on iOS and iPadOS)...

rpk98c commented 4 years ago

Just to add, I do get the same flickering on iOS.

Constans commented 4 years ago

Just to add, I do get the same flickering on iOS.

@rpk98c, you can add some info for the Flutter team to check it out (actual device/OS version/browser version/Flutter version).

rpk98c commented 4 years ago

@Constans Good point.

I see this issue, very pronounced, on the following:

Flutter Target Platform Web

Target OS version/browser/device macOS 10.14.6 Safari 13.0.5, iMac iOS 13.1.3 Safari, iPhone 10

Output from flutter doctor

[✓] Flutter (Channel master, v1.15.4-pre.99, on Mac OS X 10.14.6 18G95, locale en-GB)

[!] Android toolchain - develop for Android devices (Android SDK version 28.0.3)
    ! Some Android licenses not accepted.  To resolve this, run: flutter doctor --android-licenses
[✓] Xcode - develop for iOS and macOS (Xcode 11.3.1)
[✓] Chrome - develop for the web
[✓] Android Studio (version 3.5)
[!] IntelliJ IDEA Ultimate Edition (version 2017.3.5)
    ✗ Flutter plugin not installed; this adds Flutter specific functionality.
    ✗ Dart plugin not installed; this adds Dart specific functionality.
[✓] VS Code (version 1.42.0)
[✓] Connected device (2 available)

! Doctor found issues in 2 categories.

I also tried on beta channel with same results.

Thanks

Constans commented 4 years ago

So this happens on the dev channel as well?

Reporting issues that are on the master channel might be sometime useless due to the perpetual WIP status of that branch (at least on the vx.y.x.-pre.## releases).

I test on an iPhone SE and on an iPad Air 2 and see no flickering (all with the latest available updates OS/Safari version).

rpk98c commented 4 years ago

It happens on beta and master one of which is needed for web support. I've first spotted on beta and then moved to master to see if the issue had been resolved.

I'll test on both channels on various devices and see if I can get a more accurate picture. I believe it's the previous web issue of the wrong paint order for a stack, with the background of a container being drawn over the image to cause the flicker. Let me dig and post more later today/

rpk98c commented 4 years ago

@Constans Do you have sample image url's that fail?

I've discovered the URL can change the behaviour. My images are stored in Firebase Storage and all flicker, but if I move them to a different server the flickering completely disappears.

So it could be headers or a difference in the way the image is served?

Sample URL for image that flickers:

https://firebasestorage.googleapis.com/v0/b/monkeysource-marmoset.appspot.com/o/theme%2Fwhitmore-park%2Fx2.0%2Fimages%2Fmenu%2Fwhitmore_park_logo.png?alt=media

Sample URL for image that does not flicker:

https://marmoset.digital/img/theme_whitmore-park_x2.0_images_menu_whitmore_park_logo.png?alt=media

The file is the same, but headers are slightly different.

Thanks,

Ryan

rpk98c commented 4 years ago

@Constans Just noticed you're using firebase storage for your images too. Could you test with them somewhere else?

Constans commented 4 years ago

Sorry, @rpk98c, I was out of the loop.

I don't use firebase storage. The issues I get are with files stored on S3 type storage (CDN backed by DigitalOcean). The images are served over HTTPS.

I had issues with playing MP4 videos on iOS devices with Safari. Technically supported in the browser there was a problem with the hosting servers. The problem is that the servers don't support byte-range requests.

@indigothm uses firebase storage.

rpk98c commented 4 years ago

As an update, my issue was related to invalid CacheControl headers on my files. Even though Image.network says these are ignore on the web, and they appear to be in Chrome, when in Safari this was the cause of the flickering. Updating the cache headers to a long expiry time has resolved for me.

rpk98c commented 4 years ago

@indigothm I've taken a look at your images and you're returning cache-control: private, max-age=0 as a header. If you update this to allow caching I think the flicker will be resolved.

kartabya commented 4 years ago

@indigothm I've taken a look at your images and you're returning cache-control: private, max-age=0 as a header. If you update this to allow caching I think the flicker will be resolved.

Where exactly can I update these values? I'm a bit of a noobie in this area.

Constans commented 4 years ago

@indigothm I've taken a look at your images and you're returning cache-control: private, max-age=0 as a header. If you update this to allow caching I think the flicker will be resolved.

Where exactly can I update these values? I'm a bit of a noobie in this area.

@kartabya, on the server-side (the server that hosts your images). There's a short read on the matter here: https://en.wikipedia.org/wiki/Web_cache#Cache-control The setup is different, depending on the technology used on the server-side, but the mechanics are the same.

ayushin commented 4 years ago

I have the same problem, cache is set to public, max-age=3600 (and it is served from Memory Cache):

Summary
URL: https://eat.aahi.io/assets/assets/svg_icons/heart.svg
Status: 200
Source: Memory Cache
Initiator: 
html_image_codec.dart:39

Request
No request, served from the memory cache.

Response
Content-Encoding: br
Cache-Control: public, max-age=3600
Vary: Accept-Encoding
Date: Tue, 12 May 2020 12:11:46 GMT
Expires: Tue, 12 May 2020 13:11:46 GMT
Content-Type: image/svg+xml
ETag: W/"e8ef9f2b5a704079e21791b5e28b69a7"
Last-Modified: Thu, 16 Apr 2020 11:10:09 GMT
Server: cloudflare
x-goog-stored-content-encoding: identity
x-goog-generation: 1587035409202316
x-goog-meta-goog-reserved-file-mtime: 1586877134
x-goog-storage-class: STANDARD
x-guploader-uploadid: AAANsUkyJanJlNlpaPCAXdt7iy0aUHo3B_1uXKkcfp80ThLlM7xGFGO9YceXQR2BMv3EmzdMutaQFjNfWMpw1tFkNcoa6HSUaQ
x-goog-stored-content-length: 1523
x-goog-hash: crc32c=oJE5ZA==, md5=6O+fK1pwQHniF5G14otppw==
x-goog-metageneration: 1
cf-request-id: 02aa6565690000fa7c400cd200000001
expect-ct: max-age=604800, report-uri="https://report-uri.cloudflare.com/cdn-cgi/beacon/expect-ct"
cf-cache-status: MISS
cf-ray: 59240b4f0993fa7c-AMS
Garciconx commented 4 years ago

I have the same issue

Garciconx commented 4 years ago

@Constans Do you have sample image url's that fail?

I've discovered the URL can change the behaviour. My images are stored in Firebase Storage and all flicker, but if I move them to a different server the flickering completely disappears.

So it could be headers or a difference in the way the image is served?

Sample URL for image that flickers:

https://firebasestorage.googleapis.com/v0/b/monkeysource-marmoset.appspot.com/o/theme%2Fwhitmore-park%2Fx2.0%2Fimages%2Fmenu%2Fwhitmore_park_logo.png?alt=media

Sample URL for image that does not flicker:

https://marmoset.digital/img/theme_whitmore-park_x2.0_images_menu_whitmore_park_logo.png?alt=media

The file is the same, but headers are slightly different.

Thanks,

Ryan

The issue is related with firebase in my case

ayushin commented 4 years ago

Yes, ok, I found a way how to reproduce the bug: just disable cache in Chrome devtools Network tab and you get the flickers.

kartabya commented 4 years ago

Yes but I'm asking this for my client work. How can I configure the images such that it works fine for everyone, not just my browser?

On Wed, May 13, 2020 at 11:34 AM Alexis Yushin notifications@github.com wrote:

Yes, ok, I found a way how to reproduce the bug: just disable cache in Chrome devtools Network tab and you get the flickers.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/flutter/flutter/issues/48373#issuecomment-627760580, or unsubscribe https://github.com/notifications/unsubscribe-auth/AMIIV7VCCWQNOHI6OJANKZDRRIYF5ANCNFSM4KECWMAQ .

--

Kartabya Aryal Kathmandu, Nepal

Constans commented 4 years ago

There seems to be a bug introduced in version 1.19.0-1.0.pre that messes every image in ListViews (as far as I experienced).

@kartabya, you should just revert to the 1.19.0-0.0.pre using flutter version 1.19.0-0.0.pre or flutter downgrade as a temporary fix.

And remember that you should not use beta tools in prod, because you'll get burned with such issues.

ayushin commented 4 years ago

I'm on Flutter 1.19.0-0.0.pre • channel dev and the issue is still here. Can't go to stable because then FlatButton with color won't work :-/

slavap commented 4 years ago

There seems to be a bug introduced in version 1.19.0-1.0.pre that messes every image in ListViews (as far as I experienced).

Yes, something is really broken in 1.19.0-1.0.pre with images, I had to revert back to 1.18.0-13.0.pre

Constans commented 4 years ago

I'm on Flutter 1.19.0-0.0.pre • channel dev and the issue is still here. Can't go to stable because then FlatButton with color won't work :-/

In Safari they flicker. In Chrome, they don't. The reasons are discussed above (other than the weird new issues introduced in version 1.19.0-1.0.pre).

Note that on Chrome they'll always flicker if you have your dev tools opened in browser...

Constans commented 4 years ago

There seems to be a bug introduced in version 1.19.0-1.0.pre that messes every image in ListViews (as far as I experienced).

Yes, something is really broken in 1.19.0-1.0.pre with images, I had to revert back to 1.18.0-13.0.pre

1.19.0-0.0.pre is safe from my tests.

slavap commented 4 years ago

I think we need to open new issue about 1.19.0-1.0.pre, images in ListViews are broken in Chrome (without dev tools open) and everything is flickering as crazy.

Constans commented 4 years ago

I think we need to open new issue about 1.19.0-1.0.pre, images in ListViews are broken in Chrome (without dev tools open) and everything is flickering as crazy.

Done that. I'm not sure there isn't another one already opened, but it'll be marked as duplicate if so.

Images and texts are disappearing and switching parent ListViews like in a madhouse. :)

Constans commented 4 years ago

Anyway, we all should at least use beta for production if bugs like these are a show stopper, or revert to a working version on dev. On master I don't even bother to report bugs because that is constantly changing.

Most bugs will already be solved by the time someone reads my bug report.

Truth is that good software is hard, things always break, and complex software is a nightmare to maintain.

From my point of view, the Flutter team does a great job.

ferhatb commented 4 years ago

Verified that Safari will re-download image when cache header is wrong.

Although this is fine for static web pages, as soon as Flutter mutates DOM even an tag with identical src causes refresh/flicker.

A fix will be landing shortly for this to reuse img elements across frames. Thanks for patience!

ferhatb commented 4 years ago

@indigothm Thank you for reporting this. PR landed in engine, now waiting for engine roll into flutter, you should have the fix shortly in flutter master. @rpk98c, thx as well, we tested with your url that used to flicker in Safari, after this fix it is stable when resizing browser/image. This fix removes cross frame insert/remove DOM operations, so as a bonus you should see smoother scrolling in many apps as well.

slavap commented 4 years ago

@ferhatb What about remaining problem reported in this comment https://github.com/flutter/flutter/issues/57105#issuecomment-629777043 ? I've never seen such flickering in 1.18

ricardochen commented 4 years ago

This also made images disappear on listViews and gridviews on scroll

ferhatb commented 4 years ago

The image disappearing issue was fixed in a separate PR by @yjbanov.

Garciconx commented 4 years ago

any updates?

slavap commented 4 years ago

@ferhatb image disappearing was fixed, but looks like TextFormField flickering was not fixed.

Garciconx commented 4 years ago

@ferhatb image disappearing was fixed, but looks like TextFormField flickering was not fixed.

in which version and channel?

slavap commented 4 years ago

@Garciconx Channel master, 1.19.0-2.0.pre.83, see https://github.com/flutter/flutter/issues/57105#issuecomment-629777043

ferhatb commented 4 years ago

@ricardochen reproduced issue of image removal, fix landing shortly.

nicolascavallin commented 4 years ago

@Constans Do you have sample image url's that fail? I've discovered the URL can change the behaviour. My images are stored in Firebase Storage and all flicker, but if I move them to a different server the flickering completely disappears. So it could be headers or a difference in the way the image is served? Sample URL for image that flickers: https://firebasestorage.googleapis.com/v0/b/monkeysource-marmoset.appspot.com/o/theme%2Fwhitmore-park%2Fx2.0%2Fimages%2Fmenu%2Fwhitmore_park_logo.png?alt=media Sample URL for image that does not flicker: https://marmoset.digital/img/theme_whitmore-park_x2.0_images_menu_whitmore_park_logo.png?alt=media The file is the same, but headers are slightly different. Thanks, Ryan

The issue is related with firebase in my case

I fix the problem setting the metadata with

SettableMetadata(cacheControl: 'public, max-age=3600, s-maxage=3600')

when I upload the file to firebase storage.

kekko7072 commented 4 years ago

@nicolascav Sorry but can you explain how did you do It? I am having the same problem with images only in safari. 🙆‍♂️

nicolascavallin commented 4 years ago

@nicolascav Sorry but can you explain how did you do It? I am having the same problem with images only in safari. 🙆‍♂️

Hey dude, in the dart code:

carbon

firebase.apps.single.storage() .ref('YourImagePathAndName.jpeg') .put(_imageFull, firebase.UploadMetadata( contentType: 'image/jpeg', cacheControl: 'public, max-age=3600, s-maxage=3600' ) );

kekko7072 commented 4 years ago

Thank you it solve the problem of safari. But can you explain why i can't see the metadata in the Firebase?

nicolascavallin commented 4 years ago

I would like to know the same thing!

The only way to modify headers that I found was that.

I hope Firebase Storage will have more features.

El dom., 14 jun. 2020 a las 4:51, Francesco Vezzani (< notifications@github.com>) escribió:

Thank you it solve the problem of safari. But can you explain why i can't see the metadata in the Firebase?

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/flutter/flutter/issues/48373#issuecomment-643732171, or unsubscribe https://github.com/notifications/unsubscribe-auth/AFPF2UISNRWBX4MO4WSW4QLRWR6PHANCNFSM4KECWMAQ .

nikssj commented 4 years ago

@Constans Do you have sample image url's that fail? I've discovered the URL can change the behaviour. My images are stored in Firebase Storage and all flicker, but if I move them to a different server the flickering completely disappears. So it could be headers or a difference in the way the image is served? Sample URL for image that flickers: https://firebasestorage.googleapis.com/v0/b/monkeysource-marmoset.appspot.com/o/theme%2Fwhitmore-park%2Fx2.0%2Fimages%2Fmenu%2Fwhitmore_park_logo.png?alt=media Sample URL for image that does not flicker: https://marmoset.digital/img/theme_whitmore-park_x2.0_images_menu_whitmore_park_logo.png?alt=media The file is the same, but headers are slightly different. Thanks, Ryan

The issue is related with firebase in my case

I fix the problem setting the metadata with

SettableMetadata(cacheControl: 'public, max-age=3600, s-maxage=3600')

when I upload the file to firebase storage.

Do you know a solution if I've to download it from Firebase? I have the same problem when downloading files from fbase.

EDIT: Vi que sos de Argentina, tengo el mismo problema cuando descargo imagenes de firebase, por alguna razón cuando hago el deploy del proyecto como PWA, en iOS las imágenes parpadean. En mi caso las descargo de la siguiente manera:

return FadeInImage.assetNetwork(
        image:
            'https://firebasestorage.googleapis.com/v0/b/{"google.appspot.com"}/o/{"directory"}%2F${"ImagenName.jpg"}?alt=media',
        placeholder: 'assets/images/loading.gif',
        fadeInCurve: Curves.ease,
        height: size.height * 0.40,
        width: size.width * 0.85,
        fit: BoxFit.fill);
kekko7072 commented 4 years ago

@Constans Do you have sample image url's that fail? I've discovered the URL can change the behaviour. My images are stored in Firebase Storage and all flicker, but if I move them to a different server the flickering completely disappears. So it could be headers or a difference in the way the image is served? Sample URL for image that flickers: https://firebasestorage.googleapis.com/v0/b/monkeysource-marmoset.appspot.com/o/theme%2Fwhitmore-park%2Fx2.0%2Fimages%2Fmenu%2Fwhitmore_park_logo.png?alt=media Sample URL for image that does not flicker: https://marmoset.digital/img/theme_whitmore-park_x2.0_images_menu_whitmore_park_logo.png?alt=media The file is the same, but headers are slightly different. Thanks, Ryan

The issue is related with firebase in my case

I fix the problem setting the metadata with

SettableMetadata(cacheControl: 'public, max-age=3600, s-maxage=3600')

when I upload the file to firebase storage.

Do you know a solution if I've to download it from Firebase? I have the same problem when downloading files from fbase.

EDIT: Vi que sos de Argentina, tengo el mismo problema cuando descargo imagenes de firebase, por alguna razón cuando hago el deploy del proyecto como PWA, en iOS las imágenes parpadean. En mi caso las descargo de la siguiente manera:

return FadeInImage.assetNetwork(
        image:
            'https://firebasestorage.googleapis.com/v0/b/{"google.appspot.com"}/o/{"directory"}%2F${"ImagenName.jpg"}?alt=media',
        placeholder: 'assets/images/loading.gif',
        fadeInCurve: Curves.ease,
        height: size.height * 0.40,
        width: size.width * 0.85,
        fit: BoxFit.fill);

You Need ti change the metadata when you upload the images. This Is the only One solution.

nicolascavallin commented 4 years ago

@Constans Do you have sample image url's that fail? I've discovered the URL can change the behaviour. My images are stored in Firebase Storage and all flicker, but if I move them to a different server the flickering completely disappears. So it could be headers or a difference in the way the image is served? Sample URL for image that flickers: https://firebasestorage.googleapis.com/v0/b/monkeysource-marmoset.appspot.com/o/theme%2Fwhitmore-park%2Fx2.0%2Fimages%2Fmenu%2Fwhitmore_park_logo.png?alt=media Sample URL for image that does not flicker: https://marmoset.digital/img/theme_whitmore-park_x2.0_images_menu_whitmore_park_logo.png?alt=media The file is the same, but headers are slightly different. Thanks, Ryan

The issue is related with firebase in my case

I fix the problem setting the metadata with SettableMetadata(cacheControl: 'public, max-age=3600, s-maxage=3600') when I upload the file to firebase storage.

Do you know a solution if I've to download it from Firebase? I have the same problem when downloading files from fbase.

EDIT: Vi que sos de Argentina, tengo el mismo problema cuando descargo imagenes de firebase, por alguna razón cuando hago el deploy del proyecto como PWA, en iOS las imágenes parpadean. En mi caso las descargo de la siguiente manera:

return FadeInImage.assetNetwork(
        image:
            'https://firebasestorage.googleapis.com/v0/b/{"google.appspot.com"}/o/{"directory"}%2F${"ImagenName.jpg"}?alt=media',
        placeholder: 'assets/images/loading.gif',
        fadeInCurve: Curves.ease,
        height: size.height * 0.40,
        width: size.width * 0.85,
        fit: BoxFit.fill);

🇦🇷❤️

I answer in English in case it is useful for someone else.

Sorry, but no. I just use the images in a PWA.

I try EVERYTHING for avoid the problem in iOS, and then, try with other image services. The only one solution that I've found, like @kekko-maker said, was sending metadata to Firebase.

kekko7072 commented 4 years ago

@Constans Do you have sample image url's that fail? I've discovered the URL can change the behaviour. My images are stored in Firebase Storage and all flicker, but if I move them to a different server the flickering completely disappears. So it could be headers or a difference in the way the image is served? Sample URL for image that flickers: https://firebasestorage.googleapis.com/v0/b/monkeysource-marmoset.appspot.com/o/theme%2Fwhitmore-park%2Fx2.0%2Fimages%2Fmenu%2Fwhitmore_park_logo.png?alt=media Sample URL for image that does not flicker: https://marmoset.digital/img/theme_whitmore-park_x2.0_images_menu_whitmore_park_logo.png?alt=media The file is the same, but headers are slightly different. Thanks, Ryan

The issue is related with firebase in my case

I fix the problem setting the metadata with SettableMetadata(cacheControl: 'public, max-age=3600, s-maxage=3600') when I upload the file to firebase storage.

Do you know a solution if I've to download it from Firebase? I have the same problem when downloading files from fbase.

EDIT: Vi que sos de Argentina, tengo el mismo problema cuando descargo imagenes de firebase, por alguna razón cuando hago el deploy del proyecto como PWA, en iOS las imágenes parpadean. En mi caso las descargo de la siguiente manera:

return FadeInImage.assetNetwork(
        image:
            'https://firebasestorage.googleapis.com/v0/b/{"google.appspot.com"}/o/{"directory"}%2F${"ImagenName.jpg"}?alt=media',
        placeholder: 'assets/images/loading.gif',
        fadeInCurve: Curves.ease,
        height: size.height * 0.40,
        width: size.width * 0.85,
        fit: BoxFit.fill);

🇦🇷❤️

I answer in English in case it is useful for someone else.

Sorry, but no. I just use the images in a PWA.

I try EVERYTHING for avoid the problem in iOS, and then, try with other image services. The only one solution that I've found, like @kekko-maker said, was sending metadata to Firebase.

rpk98c commented 4 years ago

Hi,

Thanks for all for the support. The issue seems mainly resolved but I can still replicate in a specific scenario even with correct cache headers.

Create a PWA and add to home screen on an iOS device, iPad tested. The image flickers are back on hero animations and certain scrolling. If I remove the service worker fetch code then the flicker goes too, but with the default flutter_service_worker and an app added to home screen then I see the flicker.

At a stab in the dark, it feels like the service worker is causing a cached image fetch to be aysnc and causing the flicker on request.

Thanks

Ryan

Paul-cbt commented 3 years ago

Problem persists on beta channel, images start flickering when in column inside singleChildScrollView when i start scrolling up and down, both images from assets and network