前言：近期Google中国给公司的应用提了一些优化方面的意见，该片讲述的是其中的意见之一：overdraw

基础知识

过度绘制定义

屏幕上的某个像素在同一帧的时间内被绘制了多次。

过度绘制的影响？

影响动画的播放，影响界面响应速度，浪费不必要的GPU

如何判断过度绘制的点？

1. 开发者选项中调试GPU过度绘制开启，界面显示红色则为需要关注的地方
   蓝色（1x） 绿色（2x） 淡红色（3x） 红色（4x+）

2. Hierarchy Viewer

从层级角度分析存在的影响性能的点
查看层级超过5层, 你就需要考虑优化下布局了~

Measure红点, 可能是布局中嵌套RelativeLayout, 或是嵌套LinearLayout都使用了weight属性.
Layout红点, 可能是布局层级太深.
Draw红点, 可能是自定义View的绘制有问题, 复杂计算等.

推荐实践

Removing unneeded backgrounds in layouts.

• 尽量的减少布局容器background属性的应用（实验发现只增加布局的层级并不会增加颜色的程度（通过开启调试GPU过度绘制））。
• 布局设计在牵涉到嵌套时，应该注意嵌套的布局的背景色是否和被嵌套的布局背景色一致，如果一致可以考虑去除相同的背景色，减少绘制；
• 在布局中，如果存在多个线性布局重叠时，可以考虑只针对最上层的布局设置背景色，而不需要每一个布局（例如LinearLayout）都设置背景色，过多的相同的背景色会导致过度绘制；
• 在设计到activity类中，如果牵涉到的布局存在背景色，可以考虑消除窗口的背景色，减少1X的绘制。

Flattening the view hierarchy.

具体结合Hierarchy Viewer分析出过多重叠的父布局点（两个父节点并列的情况），结合具体的业务场景，合理使用Include，Viewstub，Merge来减少层级。

• ViewStub , Include , merge三件套
  ViewStub(延迟加载)：互斥，某一情况下才出现 注意只有inflate之后才能去findView
  merge只能作为根布局因为merge标签并不是View，所以在通过LayoutInflate.inflate方法渲染的时候，第二个参数必须指定一个父容器，且第三个参数必须为true，也就是必须为merge下的视图指定一个父亲节点。
  因为merge不是View，所以对merge标签设置的所有属性都是无效的

自定义控件onDraw()方法[未验证]

onDraw()中使用canvas.clipRect() ， clipPath来帮助系统识别那些可见的区域

其他优化方向

AS--> Inspect Code --> 分析当前工程

Analyze tools.PNG

会得到类似这样的优化建议：
Handler reference leaks, HashMap can be replaced with AparseArray, Inefficient layout weight等，按照给出的AS给出的工具来具体的

总结

• 渲染通道包含Layout Measure两个时期，所以当使用LinearLayout中子布局使用weight时，排列方向上的宽或者搞明确的指定为0dp
• 通过"调试GPU过度绘制"来快速定位存在过度绘制点，从background，和层级的角度结合具体业务场景来分析如果优化布局
• 从层级的角度通过HV快速定位需要优化的点
• 打开过度绘制调试显示出来的那些颜色时半透明的，屏幕上你看到的真正的颜色依赖于你UI的内容色
• 记住有些过度绘制时不可避免的，当你调整应用用户接口的，尽量的让可见的地方显示其整正德颜色或者只绘制两次

参考

Reducing Overdraw

Inspect GPU Rendering Speed and Overdraw

Performance and View Hierarchies