gabe
gabe

Reputation: 97

Cache Image from Firebase

I have multiple cells that currently hold different photos from Firebase. Every time a user loads these images then scrolls, they are re-downloaded which eats up data fast. I find this concerning to any user who has a metered data plan. What could I do to solve this? Does Firebase offer any options to cache downloaded images?

This is how I am currently calling an image into a cell:

if let imageName = post["image"] as? String {
        let imageRef = FIRStorage.storage().reference().child("images/\(imageName)")
        imageRef.data(withMaxSize: 25 * 1024 * 1024, completion: { (data, error) -> Void in if error == nil {
            let image = UIImage(data: data!)
            cell.postImageView.image = image

Upvotes: 4

Views: 6462

Answers (3)

You might use Alamofire too. It does not handle caching automatically though, but against Kingfisher, it has the ability to handle almost all kinds of networking needs.

PS: Yes I know that -generally- I do not need any networking capabilities if I'm using Firebase.

But, for example; since Firebase Database and Firestore cannot handle full-text search, you need to use third-party solutions, so, you might be in need of full-featured networking utility sometime.

Upvotes: 0

klaudas
klaudas

Reputation: 457

Use Kingfisher to cache images. It's light and very easy to use. Just pass your url from firebase and it will automatically cache it.

let url = URL(string: "url_of_your_image")
imageView.kf.setImage(with: url)

Upvotes: 7

xxfast
xxfast

Reputation: 737

Firebase already does cache the database locally, before it fetch real-time data from the server, so the problem is not as severe. But if you want to do better caching, use Glide, Glide caches images and you can specify time signatures so it re-fetches images only if they are updated.

This is super easy, but you do need to host your images in google cloud services, or aws, or anywhere even

 ImageView imageView = (ImageView) findViewById(R.id.my_image_view);
 Glide.with(this).load("url").into(imageView);

Upvotes: 0

Related Questions