Flutter NetworkImage 与 cached_network_image

19

Flutter建议在这里使用cached_network_imagehttps://flutter.dev/docs/cookbook/images/cached-images。我用了它,效果很好。我也尝试了NetworkImage,也可以。

我从文档中了解到NetworkImage也会将下载的图片缓存在本地。那么相比之下,为什么要使用cached_network_image而不是NetworkImage呢?它们的缓存策略有何区别?


1
问题已经得到正确回答,请标记答案为正确,以便能够正确指导其他开发人员。 - Jagadish
3个回答

21
区别显著,也非常有帮助......您知道从网络获取图像需要时间,因此cached network image提供了选项,用于在加载时显示占位符和在无法加载时显示错误小部件,这些功能在NetworkImage中是不存在的。作为开发人员,您必须准备好应对各种情况,这就是建议使用cached network images的原因。
更新: ImageNetwork现在有loadingBuilder和errorbuilder参数,因此它也可以像cached network image一样显示加载指示器。但是,在CachedImageNetwork中,一旦图像被加载,它将被缓存在系统中,直到URL更改,这使得每次加载图像都更快,还有许多其他功能可供探索,请参见官方文档

因此,我仍然更喜欢使用cachedNetworkImage,直到NetworkImage拥有类似的功能。

希望你理解!否则,请在下面的评论中让我知道!


1
谢谢!占位符确实很有帮助。除此之外,缓存策略方面怎么样? - ArtS
1
例如,它们在哪里保存临时文件,它们是否都使用URL保存和获取缓存图像,同一URL应在多长时间后重新加载等。 - ArtS
缓存的网络图片使用flutter_cache_manager存储和检索文件。CacheManager用于在应用程序的缓存目录中下载和缓存文件。可以更改有关保留文件时间的各种设置。它使用cache-control http头来有效地检索文件。希望您已经理解了...有关详细信息,请参阅这两个插件的文档。如果您觉得我可以帮助您,请标记为接受并点赞! - Jagadish
谢谢,现在我知道该去哪里查看和学习了。只是想确认一下:我应该查看 cache_manager.dart 来使用 cached_network_image,并查看 image_cache.dart 来使用 NetworkImage,对吗? - ArtS
Image.network现在有一个loadingBuilder参数,因此它也可以显示加载指示器。这是否意味着使用CachedNetworkImage没有优势了? - Wes1324
显示剩余3条评论

0

我使用了两种方法,但并没有看到任何显著的加载时间改善。每次我的应用程序启动时,似乎都会下载图像。

仅供参考,我将图像保存在Azure Blob存储中。 图像URL是MongoDB的一部分。

这些图像是从相机中捕获或从库中选择后上传到Azure的。 为什么缓存似乎无法正常工作呢?


-1

区别在于缓存的网络图片在从互联网获取图像时具有加载指示器,并在获取图像时发生错误时显示错误图标。而网络图片没有这些功能。 https://pub.dev/packages/cached_network_image


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接