iOS crashed when loading thousands Images with CachedNetworkImageProvider in Listview

[boomery]

🐛 Bug Report

Rapidly scrolling through a ListView in iOS , when i stop scrolling, the memory usage keep rising until the app crashes.

Expected behavior

The image cache usage should be kept within the restricted range.

Reproduction steps

already set the cache limit in main.dart

PaintingBinding.instance.imageCache.maximumSize = 10; PaintingBinding.instance.imageCache.maximumSizeBytes = 1024 *1024 * 100;//MB

i've used ScrollAwareImageProvider ，set maxWidth&maxHeight for CachedNetworkImageProvider

Configuration

**Version: Flutter 3.22.2 Dart 3.4.3

Platform:

• [ ] :iphone: iOS

[boomery]

I printed out the values using a timer and found that while the scrolling was paused, the value of PaintingBinding.instance.imageCache.liveImageCount would keep increasing, is there anyway to limit it

[boomery]

It feels like all the picture widgets I've scrolled through are still being downloaded and cached, even though they are no longer displayed on the current screen, and they cannot be released, ultimately leading to a memory overflow.

[boomery]

When I stop scrolling Listview after a while, pendingImageCount first increases gradually and then decreases to 0. Before pendingImageCount reaches 0, the memory usage remains in an upward state. The memory usage is released entirely when pendingImageCount reaches 0 instantaneously, just as shown in the picture

[drnko]

Hi,

We too are facing the same issue by loading only 10 images in a listView and the web app crashes.

The issue still persists even after resizing the images. We are using the canvaskit for rendering. We do not want to use the 3rd party dependency storage for uploading/retrieving.

You can check it out the Web App, below on the Android/iOS/Windows browsers, except iOS everywhere the web app is working fine:

https://web.drnko.com/

Demo user mobile number: 1234567890 OTP: Enter 1234

Regards!

[VB10]

Hi I getting same issue in my list view. Do you have any idea for this problem or any suggestion. Thank you so much. Then when i open detail page, it also crash again.

(I've improved some logical operation like mem cache size etc. It temprorary work but i think we need the beter solution for next time usage)

[ziqq]

Hello, I have this same issue

[drnko]

Any update on this bug???

[olers]

I have the same problem. After setting the errorListener parameter of CachedNetworkImageProvider to null, the problem is solved. Now I am investigating the root cause.

[gj-loitp]

hi @boomery do you have any solution to fix this? i am also facing the same problem

[boomery]

hi @boomery do you have any solution to fix this? i am also facing the same problem

. you may use this widget to fix this

[jpetro416]

Related issue here: https://github.com/Baseflow/flutter_cached_network_image/issues/830#issuecomment-2849137438

[unix14]

hi @boomery do you have any solution to fix this? i am also facing the same problem

. you may use this widget to fix this

can you show an example? what should be wrapped as a resize image??

[liyaona]

hi @boomery do you have any solution to fix this? i am also facing the same problem

. you may use this widget to fix this

can you show an example? what should be wrapped as a resize image??

ResizeImage isn’t a widget you wrap around something — it’s an ImageProvider. Basically, you take your existing provider (like AssetImage, NetworkImage, etc.) and wrap it with ResizeImage, then pass it into an Image widget. For example: Image( image: ResizeImage( AssetImage("assets/large_image.png"), width: 200, height: 200, ), ) The key point: this resizes the image when decoding, so it saves memory vs. just scaling the widget with BoxFit.