Image loading performance optimization and image loading Performance Optimization

Image loading performance optimization and image loading Performance Optimization

In addition to good interaction experience, good software also requires good smoothness, and performance optimization is also very important for applications. In the developer option, open the "GPU rendering mode analysis" option to intuitively view the performance of the application.

In my painting project, I found that when using the ViewPager control to slide and preview an image, the yellow line exceeded, which indicates that the frame is dropped. (Although this performance indicator has exceeded the standard, the user does not feel it. The purpose of optimization is to provide a better user experience)

Yellow indicates the time-consuming operation of eglSwapBuffer. The time consumed by each step is accumulated. frames are dropped as long as they do not exceed the Green Line. Otherwise, frames are dropped, that is, choppy (although the system thinks that choppy users do not feel this way, but it also becomes choppy ). The yellow color is mainly related to opengl and the underlying rendering of the system. After the entire system is basically stable, this part is basically stable. The reason for exceeding the yellow line is that the large memory image is loaded. Because of the project requirements, I need to load two large images (PNG) each time I slide, only one of which is used for display.

Optimization Method:

Because I am responsible for painting applications, I saved three images in PNG format during painting (1. Small images used for list display. 2. Preview a large image. 3. Large image for painting). The memory occupied by images in PNG format is much larger than that in JPEG format. It takes a relatively long time to load images in PNG format. However, a transparent layer is required. The image on the painting interface must be in PNG format, and the other two images must be saved in JPEG format, and adjusted to 90% resolution (the difference between 100% and 90% in JPEG format is not very big, it is difficult for the naked eye to separate, can compress the memory space occupied by the image. I have tested that the image definition above 80% is not obvious, but the difference between 80% and 80% is obvious. We do not recommend that you use less ). However, make sure that the resolution of PNG Image 100% is saved. Because the image is painted in PNG format and then saved, this ensures that the two pictures in JPEG format are 90% clear, but there will be no increasingly unclear situations like 90% * 90%.

After the optimization is completed, we tested that the yellow line basically does not exceed the Green Line standard and complies with the standard. This indicates that the speed of loading images has been improved and the memory size of applications can be optimized.