Cached Network SVG Image

Question

I want to display an SVG picture retrieved from network with the help of Flutter_SVG package and use the same picture in different pages with the Hero widget. But each time I use SvgPicture.network() widget, it loads the image again and again from network;

Page 1 & Page 2

 Hero(
     tag: 'randomTag',
     child: SvgPicture.network(url),
 ),

I have tried to combine Cached Network Image dependency with Flutter_SVG package but don't know how to use them as a widget together;

Hero(
  tag: 'randomTag',
  child: CachedNetworkImage(
    imageUrl: url,
    imageBuilder: (context, ImageProvider<Object> imageProvider) {
      // How to use ImageProvider<Object> with SvgPicture?
    }
  ),
),

svg_cached_network_image dependency is not an option since it is not compatible with other dependencies that I use.

Answer 1

Use flutter_cache_manager to save svg from internet

This line get svg from internet and save it to local, and next time you call it it will get from local

var file = await DefaultCacheManager().getSingleFile(url);

https://pub.dev/documentation/flutter_cache_manager/latest/flutter_cache_manager/BaseCacheManager/getSingleFile.html