Principle and Feature Comparison of Android Image Caching

This is the content I shared at MDCC (slightly modified), and it was also introduced when the first code analysis issue was released. The subsequent code analysis will be gradually done.

A comparison of several image caching libraries from the perspective of overall design and principles. Even if you haven't used them, you can also understand their implementation of certain features.

I. Basic Information of the Four Image Caching Libraries

Universal ImageLoader is an early open-source image caching library, widely used by many applications in the early days.

Picasso is an open-source project by Square, and its main sponsor is JakeWharton, so it is well-known.

Glide is an open-source project by Google employees, used by some Google Apps, and was recommended at last year's Google I/Recommended on O, but there are not many domestic materials at present.

Fresco is an image caching library opened source by Facebook in the first half of this year, with main features including:
(1Two memory caches plus native cache constitute a three-level cache

(2Supports streaming, and can display images in a blurred progressive manner similar to web pages

(3Better support for multi-frame animation images, such as Gif, WebP

Considering that Fresco has not been officially released yet 1Version 0, and I haven't had much time to familiarize myself with the Fresco source code, so the comparison does not include Fresco. It will be added to the comparison later when I have time.

More image caching libraries can be found at: Android Image Caching Libraries

II. Basic Concepts

Before the formal comparison, let's understand some common concepts of image caching:
(1RequestManager: Request generation and management module

(2Engine: The engine part is responsible for creating tasks (acquiring data) and scheduling execution.

(3GetDataInterface: Data acquisition interface, responsible for acquiring data from various data sources.
For example, MemoryCache retrieves data from memory cache, DiskCache retrieves data from local cache, and the downloader retrieves data from the network, etc.

(4Displayer: Resource (image) display, used for displaying or operating resources.
For example, ImageView, these image caches not only support ImageView but also support other Views as well as the virtual concept of Displayer.

(5) Processor Resource (Image) Processor
Responsible for processing resources, such as rotation, compression, cropping, etc.

The names of these concepts may vary in different image caches, for example, Displayer in ImageLoader is called ImageAware, and in Picasso and Glide it is called Target.

3. Common Advantages

1. Simple to use
All can be achieved through a single line of code to obtain and display images.

2. High configurability and high adaptability
The image cache downloader (retry mechanism), decoder, display, processor, memory cache, local cache, thread pool, cache algorithm, etc., can all be easily configured.

Highly adaptive, initializing cache configuration based on system performance and dynamically adjusting strategies after system information changes.
For example, determine the maximum concurrency based on the number of CPU cores, determine the size of memory cache based on available memory, and adjust the maximum concurrency when the network status changes, etc.

3. Multi-level cache
All have at least two-level cache to improve image loading speed.　

4. Supports multiple data sources
Supports multiple data sources, including network, local, resources, Assets, etc.

5. Supports multiple Displayers
It not only supports ImageView but also supports other Views as well as the virtual concept of Displayer.

Other minor common points include support for animation, support for transform processing, and obtaining EXIF information, etc.

4. Design and Advantages of ImageLoader

1. Overall Design and Process

The above is the overall design diagram of ImageLoader. The entire library is divided into five major modules: ImageLoaderEngine, Cache, ImageDownloader, ImageDecoder, BitmapDisplayer, and BitmapProcessor, among which Cache is divided into MemoryCache and DiskCache.

In simple terms, ImageLoader receives the task of loading and displaying images, and hands it over to ImageLoaderEngine. ImageLoaderEngine distributes the task to a specific thread pool for execution, where the task retrieves images through Cache and ImageDownloader, possibly processed by BitmapProcessor and ImageDecoder, and finally converted to Bitmap to be displayed by BitmapDisplayer in ImageAware.

2. Advantages of ImageLoader

(1Supports download progress listening

(2Can pause image loading during view scrolling
The image loading can be paused during view scrolling through the PauseOnScrollListener interface.

(3Default implementation of multiple memory caching algorithms These image caches can be configured with caching algorithms, but ImageLoader implements more caching algorithms by default, such as Size Max First Deleted, Least Recently Used, Least Recently Used First, First In First Out, and Longest Time First Deleted, etc.

(4Supports defining the naming rules of local cache files

5. Picasso Design and Advantages

1. Overall Design and Process

Above is the overall design diagram of Picasso. The entire library is divided into modules such as Dispatcher, RequestHandler, and Downloader, PicassoDrawable, etc.

Dispatcher is responsible for distributing and processing actions, including submission, pause, resume, cancel, network status change, retry, and so on.

In simple terms, Picasso receives the task of loading and displaying images, creates a Request and hands it over to the Dispatcher, the Dispatcher distributes the task to the specific RequestHandler, the task gets the image through MemoryCache and Handler (data acquisition interface), and the image is displayed in the Target through PicassoDrawable after the image is successfully obtained.

It should be noted that the 'File system' part of Data above, Picasso does not have an interface for customizing local caching, and it uses the local cache of http by default, API 9 Above uses okhttp, and below uses Urlconnection, so if you need to customize local caching, you need to redefine Downloader.

2. Advantages of Picasso

(1Built-in statistical monitoring function
Supports monitoring of image cache usage, including cache hit rate, memory size used, and traffic saved.

(2) supports priority processing
Before each task scheduling, tasks with higher priority are selected, such as when the priority of the Banner on the App page is higher than that of the Icon, it is very applicable.

(3Supports loading images only after the image size calculation is completed.

(4Supports flight mode and the number of concurrent threads varies according to the network type.
when the mobile phone switches to flight mode or the network type changes, it will automatically adjust the maximum number of concurrent threads in the thread pool, for example, the maximum concurrency for wifi is 4, 4g for 3,3g for 2
Here Picasso decides the maximum number of concurrent connections based on the network type, not the number of CPU cores.　

(5) No local cache
No local cache does not mean that there is no local cache, but that Picasso itself does not implement it and delegates it to Square's another network library okhttp to implement, which has the advantage that it can pass through the Cache in the Response Header of the request-Control and Expired control the expiration time of images.

Chapter 6: Glide Design and Advantages

1. Overall Design and Process

The above is the overall design diagram of Glide. The entire library is divided into modules such as RequestManager (request manager), Engine (data acquisition engine), Fetcher (data acquisition), MemoryCache (memory cache), DiskLRUCache, Transformation (image processing), Encoder (local cache storage), Registry (image type and parser configuration), Target (target), etc.

In simple terms, Glide receives the task of loading and displaying resources, creates a Request and hands it over to RequestManager, the Request starts the Engine to fetch resources from the data source (via Fetcher), and after obtaining them, the Transformation processes them before handing them over to the Target.

Glide relies on open-source libraries such as DiskLRUCache, GifDecoder to complete local caching and Gif image decoding tasks.

2. Glide Advantages

(1) Image Cache-> Media Cache
Glide is not only an image cache, it supports Gif, WebP, thumbnails. Even Video, so it should be considered as a media cache.　

(2) supports priority processing

(3) with Activity/The Fragment lifecycle is consistent and supports trimMemory
Glide maintains a RequestManager for each context, keeping in touch with Activity through FragmentTransaction/The lifecycle of Fragment is consistent, and there are corresponding trimMemory interface implementations available for calling.

(4) supports okhttp and Volley
Glide defaults to using UrlConnection to fetch data, which can be used in conjunction with okhttp or Volley. In fact, ImageLoader and Picasso also support okhttp and Volley.

(5) Memory friendly
① Glide's memory cache has an active design
When fetching data from memory cache, unlike general implementations using get, it uses remove, and then put this cache data into a value of soft reference in the activeResources map and count the reference count, and judge after the image is loaded, if the reference count is empty, then recycle it.

② Smaller images in memory cache
Glide uses the combination of url, view_width, view_height, screen resolution, etc. as a joint key to cache the processed images in memory cache, rather than the original images to save space

③ With Activity/The Fragment lifecycle is consistent and supports trimMemory

④ The default image uses the default RGB_565 instead of ARGB_888
Although the clarity is poor, the image is smaller and can also be configured to ARGB_888

Other: Glide can support URL expiration through signature or without using local cache

7. Summary

Overall, the functionality and proxy of ImageLoader are easy to understand, but the length is generally average.　

The Picasso code is simple and the logic is clear, and you can get a deep understanding of it in one or two hours, even though it is only in one package without strict package distinction.

Glide is powerful, but it has a large amount of code and complex flow. It is recommended to use it only after a deeper understanding, to avoid difficulties in troubleshooting.

That's all for the content of this article. I hope it will be helpful to your studies and I also hope everyone will support the Yelling Tutorial more.

Statement: The content of this article is from the Internet, and the copyright belongs to the original author. The content is contributed and uploaded by Internet users spontaneously. This website does not own the copyright, does not edit the content manually, and does not bear any relevant legal liability. If you find any content suspected of copyright infringement, please send an email to: notice#oldtoolbag.com (Please replace # with @ when sending an email to report abuse, and provide relevant evidence. Once verified, this site will immediately delete the content suspected of infringement.)