Best strategy to load images using Glide — Image loading library for Android

Glide is an Image Loader Library for Android developed by bumptech and is a library that is recommended by Google. It has been used in many Google open source projects including Google I/O 2014 official application.
Many of us use glide for image loading but only some of us know its real power. If we dive into the features of glide, the article will go into TL;DR category. Instead I like it to be short and sweet 😉
I have been working on glide since long and the app I am working on relies on images heavily, images in recycler view, view pager, nested recycler views and every single image is a url.
To make app smooth, we had to brainstorm on cache strategy.

How Glide Cache Works




By default, Glide checks multiple layers of caches before starting a new request for an image:
  1. Active resources — Is this image displayed in another View right now?
  2. Memory cache — Was this image recently loaded and still in memory?
  3. Resource — Has this image been decoded, transformed, and written to the disk cache before?
  4. Data — Was the data this image was obtained from written to the disk cache before?
If all four steps fail to find the image, then Glide will go back to the original source to retrieve the data from the URL.


Best Image Loading and Caching Strategy




ONE — Enable Disk CacheApplications that use the same resource multiple times in multiple sizes and are willing to trade off some speed and disk space in return for lower bandwidth usage may want to consider enabling disk cache.
You can find more details here.
To enable it we will write the following code.

val requestOptions = RequestOptions().diskCacheStrategy(DiskCacheStrategy.ALL)
Glide.with(context).load(url).apply(requestOptions).into(imageView) 


TWO — Add Image Signature
Guess, what if the image on same URL is changed? Glide will show the old image from cache.
But glide is something from heaven 😍 — it comes with the solution.
Make sure whenever the image on server is changed, it also notifies client. Let it be the latest date time stamp.Now it can be used for versioning in cache as well. Whenever new signature is provided, it will fetch the new image and cache it as well. Details.
Just add it to the request options.
val requestOptions = RequestOptions()
        .diskCacheStrategy(DiskCacheStrategy.ALL)
        .signature(ObjectKey(signature))

Glide.with(context).load(url).apply(requestOptions).into(imageView)


THREE — Override Image Size (Optional)If you need very specific size of the image and you are very sure of it, you can use the override request option. It is very useful for the thumbnails.

val requestOptions = RequestOptions()
        .diskCacheStrategy(DiskCacheStrategy.ALL)
        .signature(ObjectKey(signature))
        .override(100, 100) // resize does not respect aspect ratio

Glide.with(context).load(url).apply(requestOptions).into(imageView)


FOUR — Add Thumbnail Url
Glide’s thumbnail() API allows you to specify a RequestBuilder to start in parallel with your main request. The thumbnail() will be displayed while the primary request is loading. If the primary request completes before the thumbnail request, the image from the thumbnail request will not be shown.
If you only have a single remote URL, you can still benefit from the thumbnail API by using Glide’s override() or sizeMultiplier() APIs to force Glide to load a lower resolution image in the thumbnail request

// With thumbnail url
Glide.with(context).load(url)
        .thumbnail(Glide.with(context).load(thumbUrl))
        .apply(requestOptions).into(imageView)

// Without thumbnail url

// If you know thumbnail size
Glide.with(context).load(url)
        .thumbnail(Glide.with(context).load(url).apply(RequestOptions().override(thumbSize)))
        .apply(requestOptions).into(imageView)

// With size multiplier
Glide.with(context).load(url)
        .thumbnail(0.25f)
        .apply(requestOptions).into(imageView)


FIVE — Setup Monthly Schedule for CleaningIn case when image url is changed and old one is never used but it is still in cache and eating up the phone memory, what to do?
Glide don’t provide the solution for this but you can set up a monthly schedule to clear up all the cache. Details.

// This method must be called on the main thread.
Glide.get(context).clearMemory()

Thread(Runnable {
    // This method must be called on a background thread.
    Glide.get(context).clearDiskCache()
}).start()


SIX — Setup Cache Limit (Optional)
Glide allows applications to use AppGlideModule implementations to completely control Glide’s memory and disk cache usage. Glide tries to provide reasonable defaults for most applications, but for some applications, it will be necessary to customise these values. Be sure to measure the results of any changes to avoid performance regressions. Details can be seen here.

These were the 6 easy steps to achieve better strategy for image caching. Implement and let me know if you find it helpful.
If you have any suggestions or better approach, please do let me know in comments below, I will add them to the article.
Thank you for reading and don’t forget to clap if you liked it 🙂

Comments