Detailed explanation of Android picture performance optimization

1. Format of pictures

At present, the native picture formats supported by mobile Android platform mainly include JPEG, PNG, GIF, BMP and WebP (supported since Android 4.0), but there are only three codec formats that can be used in Android application development: JPEG, PNG and WebP. The picture format can be determined by looking at CompressFormat enumeration values of Bitmap class.

public static enum CompressFormat {
  JPEG , 
  PNG , 
  WebP;

  private CompressFormat() {

  }
}

If you want to use GIF format pictures in the application layer, you need to refer to the third-party function library for support.

1.1 JPEG

JPEG is a widely used lossy compressed image standard format, which does not support transparent and multi-frame animation. All the photographic works are finally displayed in JPEG format. By controlling the compression ratio, you can adjust the size of the picture.

1.2 PNG

PNG is a lossless compressed image format, which supports complete transparent channels. From the field of image processing, JPEG only has three channels of RGB, while PNG has four channels of ARGB. Because it is lossless compression, PNG pictures occupy a large space, which will virtually increase the size of the final APP. When doing APP slimming, PNG pictures should be processed to reduce their occupied volume.

1.3 GIF

GIF is an ancient image format, which was born in 1987. It is characterized by supporting multi-frame animation.

1.4 WebP

WebP was released by Google in 2010. It supports lossy and lossless compression, complete transparent channels and multi-frame animation. It is an ideal picture format. WebP should be the first choice in order to ensure the picture quality and limit the picture size.

2. Image compression

At present, most APP are PNG format picture resources, and we can compress PNG pictures through several tools to achieve the purpose of slimming.

2.1 Lossless compression of ImageOptim

ImageOptim is a lossless compression tool. By optimizing PNG compression parameters, removing redundant metadata and unnecessary color configuration files, it not only reduces the space occupied by PNG pictures, but also improves the loading speed without sacrificing the picture quality.

2.2 Lossy compression ImageAlpha

ImageAlpha is a lossy PNG compression tool developed by the author of ImageOptim. In comparison, the picture size has been greatly reduced. Of course, the picture quality colleagues will also be affected to a certain extent. The pictures compressed by this tool need to be confirmed by the designer before they can finally go online, otherwise it may affect the visual effect of the whole APP.

2.3 Lossy compression TinyPNG

TinyPNG is also a well-known lossy PNG compression tool, which is provided in the form of Web site. There is no independent APP installation package. Like all lossy compression tools, compressed pictures need to be confirmed by designers before they can finally go online, otherwise it may affect the visual effect of the whole APP.

There are also many lossless compression tools, such as JPEGMini, MozJPEG, etc. Everyone can choose one suitable for their own project, mainly to find a compromise between picture size and picture quality.

2.4 Conversion of PNG/JPEG to WebP

If your APP supports at least Android 4.0, you can directly use the capabilities provided by the system to support WebP. If it is a system below 4.0, you can also support WebP by integrating third-party function libraries such as webp-android-backport into APP. According to the Google test, the lossless compressed WebP file size is 45% smaller than the PNG file, and even after these PNG files are compressed by other compression tools such as ImageOptim, WebP can still reduce the file size by about 28%.

WebP conversion tools can choose Zhitu and iSparta, etc.

2.5 Try to use PNG diagram in NinePatch format

. 9. png picture format is referred to as NinePatch picture for short, which is still PNG format picture in essence. It is a special PNG format picture for Android platform, and can stretch or fill the content at the specified position of the picture. The advantages of NinePatch diagram are small size, no deformation in stretching, and it can be well adapted to various models of Android. Android SDK comes with an editing tool for NinePatch diagram, which is located in sdk/tools/draw9patch and can be started by clicking; Of course, Android Studio also integrates the function of PNG to NinePatch. We only need to right-click an PNG picture to be converted, and select Create 9-Patch File … in the pop-up dialog box to complete the conversion automatically.

3. Caching pictures

There are many cache frames for pictures, and there are 4 common ones

Android-Universal-Image-Loader Picasso Glide Fresco

The advantages and disadvantages of these four picture loading frameworks are not explained in 11, because you can know the answer by searching casually, and we can weigh which picture loading framework to use according to the project.