Application crashes when using CachedNetworkImage in listview. If there are a lot of pictures, then the application freezes and crashes. Is it possible to load each image one by one, asynchronously? Can I have a code example? Thanks.


Solution 1: Samoilov

And so, if you have the same problem as me, and you have a large list of pictures, then you can do the following:

1.Enable ListView pagination. So that when scrolling, not the entire ListView is loaded, but for example only 10 items from the List.

2.Compress pictures to the desired size using the following parameters: memCacheWidth, memCacheHeight, maxHeightDiskCache, maxWidthDiskCache

Here is my example:

CachedNetworkImage(
    memCacheWidth: 45,
    memCacheHeight: 60,
    maxHeightDiskCache: 60,
    maxWidthDiskCache: 45,
    imageUrl: imageUrl,
    imageBuilder: (context, imageProvider) => imageBuilderWidget(imageProvider),
    placeholder: (context, url) => placeholderWidget(),
    errorWidget: (context, url, error) => errorWidget(),
  );

After adding these options, remove app from the emulator and do a flutter clean


Solution 2: Benjith Kizhisseri

if need to cache images Use Opt imised cached image package. I had the same issue this package solved. if not working change width of images, add pagination if possible


Solution 3: Saurav Prakash

You can use Image.network, it solved my crash issue on IOS.

Image.network('https://example.com/image.jpg',
                      errorBuilder: (context, error, stackTrace) {
                        print(error); //do something
                      },
      loadingBuilder: (context, Widget child,
                          ImageChunkEvent loadingProgress) {
                        if (loadingProgress == null) return child;
                        return Center(
                          child: CircularProgressIndicator(
                            value: loadingProgress.expectedTotalBytes != null
                                ? loadingProgress.cumulativeBytesLoaded /
                                    loadingProgress.expectedTotalBytes
                                : null,
                          ),
                        );
                      },
                    ),