One, Android rendering mechanism
(1) Two important concepts
Screen refresh rate : The number of screen refreshes within 1 second depends on the hardware performance parameters.
Frame rate : The number of frames drawn by the CPU and GPU in 1 second.
(2) Why is it 60fps?
Currently, mobile devices generally use a 60HZ screen refresh rate . In order to match the 60HZ refresh rate , the system sets the frame rate to 60fps , so the Android rendering mechanism is 16.67ms to draw once.
It’s best to keep the two the same. If the screen refresh rate is 75 Hz, the frame rate is 60 fps, the software renders 60 times per second, and you refresh 75 times, there is no effect, except that the repeated frame rate costs electricity; the same, if you The screen refresh rate is 30 Hz, and the software is 60 fps, so half of the 60 times that the software draws per second are discarded without display.
(3) Butter Project
Google introduced a butter plan to solve the problem of uneven sliding . The Butter Project consists of three core elements: VSYNC , Triple Buffer and Choreographer .
1. The role of VSYNC : VSync is the abbreviation of Vertical Synchronization. It is a technology that has been widely used on PCs for a long time. It can be simply regarded as a timing interrupt. After receiving the VSYNC signal, the CPU immediately starts to draw the next frame of content .
2. The role of Choreographer : to receive the VSYNC signal of the system, and to uniformly manage the execution timing of tasks such as application input, animation and drawing.
3. The role of Triple Buffer : The system uses 3 buffers for display work.
Operating conditions of the double buffer system under normal conditions:
The frame rate is lower than the screen refresh rate:
The situation after the introduction of Triple Buffer:
（四）CPU、GPU、SurfaceFlinger
The origin of GPU: CPU has many tasks, doing logical calculations, memory management and display operations. Therefore, the performance will be greatly reduced in actual calculations (floating point calculations). In the era without GPU, complex graphics cannot be displayed. The computing speed is far behind the requirements of today's complex 3D games. Even if the operating frequency of the CPU exceeds 2GHZ or higher, the graphics drawing on it is not much improved. At this time, the GPU design is out.
- CPU : Central processing unit, which integrates computing, buffering, and control units, including drawing functions. The CPU processes objects into multi-dimensional graphics and textures (Bitmaps, Drawables, etc. are all packaged together into a unified texture).
- GPU : A processor similar to the CPU dedicated to processing Graphics, which is used to help speed up rasterization operations (convert the image represented by the vector graphics format into a bitmap for the display, that is, the button, textview and other components are removed Divided into different pixels for display. This is a very time-consuming operation, the introduction of GPU is to speed up the operation of rasterization). Of course, there is also a corresponding mechanism for caching data (such as buffering bitmaps that have been rasterized).
- OpenGL ES: 2D and 3D graphics application program interface API.
- Display List: Android needs to convert the XML layout file into an object that the GPU can recognize and draw. The DisplayList holds all the data information that will be handed over to the GPU to be drawn on the screen.
-
SurfaceFlinger : Accept data buffers from multiple sources, synthesize them, and then send them to the display device
The drawing principle of the
Android system Each interface in Android is composed of views of large and small sizes, and each view in the application will go through: measure, layout, and draw. Then the main thread passes to the CPU to calculate the texture, and then calls the GPU through the OpenGL ES interface for rasterization processing, and then passes the data that needs to be displayed to SurfaceFlinger through the cross-process communication mechanism, and passes the rasterized information to The hardware synthesizer outputs to the display after synthesis.
Two, UI detection tools
Layout Inspector : View hierarchy analysis
Show GPU Overrdraw : Used to detect transition drawing
Profile GPU Rendering : Used to check the rendering performance of the interface
Three, optimization plan
The main thread avoids time-consuming operations , otherwise the drawing work of the CPU may be delayed.
1. Reasonably choose the parent container
LinearLayout is easy to use, efficient, and has limited expressive power. RelativeLayout is complicated, has strong expressive ability, and is less efficient. For the same interface, use as few RelativeLayouts as possible with strong expressiveness as the container, or choose multiple LinearLayouts with weaker expressiveness to display. From the perspective of reducing overdraw, LinearLayout will increase the level of the number of controls. Naturally RelativeLayout is better, but when an interface uses LinearLayout and does not bring more controls and control levels than RelativeLayout, LinearLayout is Preferred. The appropriate container control should be selected according to the actual situation. While ensuring performance, try to avoid overdraw.
2. Remove unnecessary background
For example, the default background of the window and the outer Layout set a background, the child View sets a background, the RecyclerView sets a background, and the child Item sets a background.
3、ClipRect & QuickReject
In order to solve the problem of Overdraw, the Android system will minimize consumption by avoiding drawing components that are completely invisible. But for custom Views (usually rewriting the onDraw method), the Android system cannot detect what specific operations will be performed in onDraw, the system cannot monitor and automatically optimize, and Overdraw cannot be avoided. Can use canvas.clipRect() to help the system identify those visible areas.
4、ViewStub
For the requirement of dynamically determining which View or layout to display based on conditions at runtime, the common practice is to write all Views on it, first set their visibility to View.GONE, and then dynamically change its visibility in the code Sex. But the View will still be Inflate when Inflate is laid out, which means that objects will still be created, will be instantiated, and attributes will be set. At this time, you can choose ViewStub. When Inflate is laid out, only ViewStub will be initialized, and then when ViewStub is set to be visible, or when ViewStub.inflate() is called, the layout directed by ViewStub will be Inflate and Instantiate.
5、Merge
Role: reduce the View level
Example:
不使用Merge的布局层级：
<FrameLayout>
<include layout="@layout/layout2"/>
</FrameLayout>
<FrameLayout>
<TextView />
</FrameLayout>
<FrameLayout>
<FrameLayout>
<TextView />
</FrameLayout>
</FrameLayout>
使用Merge的布局层级：
<FrameLayout>
<include layout="@layout/layout2"/>
</FrameLayout>
<merge>
<TextView />
</merge>
<FrameLayout>
<TextView />
important point:
- The merge must be placed on the root node of the layout file.
- Because the merge tag is not a View, when rendering through the LayoutInflate.inflate method, the second parameter must specify a parent container, and the third parameter must be true, that is, a parent node must be specified for the view under the merge.
6、draw9Path
We often encounter the need to set a background image for ImageView. At this time, the overlapping area of the two drawables is drawn twice. At this time, you can make the background into draw9path, and set the part that overlaps with the foreground to be transparent. Because Android's 2D renderer will optimize the transparent area in draw9patch, this overdraw is optimized.