Android性能优化之过渡绘制(一)

转载地址:http://www.androidperformance.com/android-performance-optimization-overdraw-1.html

博客有一段时间没有更新了，到了新公司后，一直比较忙，博客也更新地不那么频繁了，倒是利用这个VPS搭建的VPN每天都在用，速度也蛮不错的。最近一直在看Android上和性能相关的部分，也就是所谓的Android性能优化，才发现Android性能这一块，自己懂得还是太少了，所以从上层开始看，也算是一点一点入门吧。这个系列将讲解学习过程中总结的和性能相关的内容。

首先将讲解一下GPU过渡绘制，也是开发者最直接接触的部分吧，这个内容将分为两个部分来将讲，第一部分初步讲解一下gpu过渡绘制的原理，和一些优化建议，第二部分将用实际例子来讲解优化GPU过渡绘制的一般步骤。

1. 过渡绘制概念:

GPU过渡绘制的概念：GPU过度绘制指的是在屏幕一个像素上绘制多次(超过一次),比如一个TextView后有背景，那么显示文本的像素至少绘了两次，一次是背景，一次是文本。GPU过度绘制或多或少对性能有些影响,设备的内存带宽是有限的，当过度绘制导致应用需要更多的带宽(超过了可用带宽)的时候性能就会降低。带宽的限制每个设备都可能是不一样的。

2. 过渡绘制的原因:

1. 太多的View叠加

2. 复杂的层级叠加

3. 更长的inflation时间

3. 过渡绘制和不合理的xml布局的影响:

1. 布局文件是一个xml文件，inflate布局文件其实就是解析xml，根据标签信息创建相应的布局对象并做关联。xml中的标签和属性设置越多，节点树的深度越深，在解析时要执行的判断逻辑、函数的嵌套和递归就越多，所以时间消耗越多；

2. inflate操作只是布局影响的第一个环节，一个界面要显示出来，在requestLayout后还要执行一系列的measure、layout、draw的操作，每一步的执行时间都会受到布局本身的影响。而界面的最终显示是所有这些操作完成后才实现的，所以如果布局质量差，会增加每一步操作的时间成本，最终显示时间就会比较长。

4. 优化工具介绍:Android提供了三个工具来帮助辨别和解决重绘问题：Hierachy Viewer，Tracer for OpenGL和Show GPU overdraw。前两个可以在ADT工具或者独立的monitor工具中找到，最后一个是在开发者选项的一部分。

1. GPU过渡绘制:对于过度绘制的测试主要通过人工进行测试，也是发现应用过渡绘制的首选途径 .通过打开开发者选项中的 显示GPU过度绘制（PS：只有android4.2及以上的版本才具备此功能)

1. 颜色标识: 从好到差:蓝-绿-淡红-红

1. 蓝色1x过度绘制
2. 绿色2x过度绘制
3. 淡红色3x过度绘制
4. 红色超过4x过度绘制

2. 验收标准:

1. 控制过度绘制为2x
2. 不允许存在4x过度绘制
3. 不允许存在面积超过屏幕1/4区域的3x过度绘制（淡红色区域）

3. Lint工具:

1. Eclipse中,点击即可,下面的窗口中会出现提示,根据提示和具体解决办法消除.
2. Android Studio自带Lint工具,不合理或者需要优化和注意的地方,会用黄色标记出来.
3. Lint工具不仅对布局有很好的优化建议,对代码中不合理的活着存在潜在风险的模块也会提出优化建议,所以一个好的建议是:多使用Lint工具检查自己的应用,尽量消除所有的建议.
4. Lint工具可以用命令行来运行,具体使用可以参考:tools.android.com
5. Lint工具的提升例子(摘自官方文档):

1. Use compound drawables(使用compound drawables) – A LinearLayout which contains an ImageView and a TextView can be more efficiently handled as a compound drawable.
2. Merge root frame(使用Merge根框架) – If a FrameLayout is the root of a layout and does not provide background or padding etc, it can be replaced with a merge tag which is slightly more efficient.
3. Useless leaf(去除无用的分支) – A layout that has no children or no background can often be removed (since it is invisible) for a flatter and more efficient layout hierarchy.
4. Useless parent (去除无用的父控件)- A layout with children that has no siblings, is not a ScrollView or a root layout, and does not have a background, can be removed and have its children moved directly into the parent for a flatter and more efficient layout hierarchy.
5. Deep layouts (注意Layout的深度) – Layouts with too much nesting are bad for performance. Consider using flatter layouts such as RelativeLayout or GridLayout to improve performance. The default maximum depth is

4. Hierarchy Viewer:此工具是一个ADT工具（或者monitor,最新版本的SDK建议不使用独立的HV工具,而是直接在monitor中进行操作.）的一部分，可以被用作对视图层级进行快速解读。在处理布局问题时特别有用，对于性能问题也很适用。Hierarchy Viewer默认只能在非加密设备使用，例如工程机，工程平板或者模拟器。为了能够在任何手机上使用Hierarchy Viewer，你得在你的应用中添加ViewServer，这是一个开源库,使用方法可以参考这里。连接上设备，打开Hierarchy Viewer(定位到tools/目录下，直接执行hierarchyviewer的命令，选定需要查看的Process，再点击Load View Hierarchy会显示出当前界面的布局Tree。在每个模块的Traffic light上有三个灯，分别代表了Measure, Layout and Draw三个步骤的性能。

5. 布局优化建议:

1. 布局原则:在Android UI布局过程中，通过遵守一些惯用、有效的布局原则，我们可以制作出高效且复用性高的UI，概括来说包括如下几点：

1. 尽量多使用RelativeLayout和LinearLayout, 不要使用绝对布局AbsoluteLayout，

1. 在布局层次一样的情况下， 建议使用LinearLayout代替RelativeLayout, 因为LinearLayout性能要稍高一点.
2. 在完成相对较复杂的布局时,建议使用RelativeLayout,RelativeLayout可以简单实现LinearLayout嵌套才能实现的布局.

2. 将可复用的组件抽取出来并通过include标签使用；
3. 使用ViewStub标签来加载一些不常用的布局；
4. 动态地inflation view性能要比SetVisiblity性能要好.当然用VIewStub是最好的选择.
5. 使用merge标签减少布局的嵌套层次
6. 去掉多余的背景颜色(查看背景颜色是否多余,可以将HierarchyView中的图导出为psd文件,然后用Photoshop查看.具体可以参考这个视频(https://www.youtube.com/watch?v=URyoiAt8098))

1. 对于有多层背景颜色的Layout来说,留最上面一层的颜色即可,其他底层的颜色都可以去掉
2. 对于使用Selector当背景的Layout(比如ListView的Item,会使用Selector来标记点击,选择等不同的状态),可以将normal状态的color设置为”@android:color/transparent”,来解决对应的问题

8. 内嵌使用包含layout_weight属性的LinearLayout会在绘制时花费昂贵的系统资源，因为每一个子组件都需要被测量两次。在使用ListView与GridView的时候，这个问题显的尤其重要，因为子组件会重复被创建.所以要尽量避免使用Layout_weight
9. 使得Layout宽而浅，而不是窄而深（在Hierarchy Viewer的Tree视图里面体现）

一些第三方客户端的过渡绘制也很严重，见微博

            

            

另外有能力看源码的同学，下面是绘制OverDraw的源码位置：/frameworks/base/libs/hwui/OpenGLRenderer.cpp,有兴趣的可以去研究研究。

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

voidOpenGLRenderer::renderOverdraw(){

    if(mCaches.debugOverdraw&&getTargetFbo()==0){

        constRect*clip=&mTilingClip;

 

        mCaches.enableScissor();

        mCaches.setScissor(clip->left,mFirstSnapshot->height-clip->bottom,

                clip->right-clip->left,clip->bottom-clip->top);

 

        // 1x overdraw

        mCaches.stencil.enableDebugTest(2);

        drawColor(mCaches.getOverdrawColor(1),SkXfermode::kSrcOver_Mode);

 

        // 2x overdraw

        mCaches.stencil.enableDebugTest(3);

        drawColor(mCaches.getOverdrawColor(2),SkXfermode::kSrcOver_Mode);

 

        // 3x overdraw

        mCaches.stencil.enableDebugTest(4);

        drawColor(mCaches.getOverdrawColor(3),SkXfermode::kSrcOver_Mode);

 

        // 4x overdraw and higher

        mCaches.stencil.enableDebugTest(4,true);

        drawColor(mCaches.getOverdrawColor(4),SkXfermode::kSrcOver_Mode);

 

        mCaches.stencil.disable();

    }

}

 

voidOpenGLRenderer::countOverdraw(){

    size_tcount=mWidth*mHeight;

    uint32_t*buffer=newuint32_t[count];

 

    glReadPixels(0,0,mWidth,mHeight,GL_RGBA,GL_UNSIGNED_BYTE,&buffer[0]);

 

    size_ttotal=0;

    for(size_ti=0;i<count;i++){

        total+=buffer[i]&0xff;

    }

 

    mOverdraw=total/float(count);

 

    delete[]buffer;

}

还有QA可能用得到的一个指标：OverDraw数值，这个的源码位置在Framework/base/core/java/android/view/HardwareRender.java中

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

privatevoiddebugOverdraw(View.AttachInfoattachInfo,Rectdirty,

                HardwareCanvascanvas,DisplayListdisplayList){

 

            if(mDebugOverdraw==OVERDRAW_TYPE_COUNT){

                if(mDebugOverdrawLayer==null){

                    mDebugOverdrawLayer=createHardwareLayer(mWidth,mHeight,true);

                }elseif(mDebugOverdrawLayer.getWidth()!=mWidth||

                        mDebugOverdrawLayer.getHeight()!=mHeight){

                    mDebugOverdrawLayer.resize(mWidth,mHeight);

                }

 

                if(!mDebugOverdrawLayer.isValid()){

                    mDebugOverdraw=-1;

                    return;

                }

 

                HardwareCanvaslayerCanvas=mDebugOverdrawLayer.start(canvas,dirty);

                countOverdraw(layerCanvas);

                finalintrestoreCount=layerCanvas.save();

                layerCanvas.drawDisplayList(displayList,null,DisplayList.FLAG_CLIP_CHILDREN);

                layerCanvas.restoreToCount(restoreCount);

                mDebugOverdrawLayer.end(canvas);

 

                floatoverdraw=getOverdraw(layerCanvas);

                DisplayMetricsmetrics=attachInfo.mRootView.getResources().getDisplayMetrics();

 

                drawOverdrawCounter(canvas,overdraw,metrics.density);

            }

}

 

privatevoiddrawOverdrawCounter(HardwareCanvascanvas,floatoverdraw,floatdensity){

            finalStringtext=String.format("%.2fx",overdraw);

            finalPaintpaint=setupPaint(density);

            // HSBtoColor will clamp the values in the 0..1 range

            paint.setColor(Color.HSBtoColor(0.28f-0.28f*overdraw/3.5f,0.8f,1.0f));

 

            canvas.drawText(text,density*4.0f,mHeight-paint.getFontMetrics().bottom,paint);

}

欢迎大家一起交流。

下一篇文章会用一个实际案例来讲解如何优化过渡绘制。

 

参考文章：

1. http://blog.chengyunfeng.com/?p=458# 翻译的一个老外的优化过程
(原链接http://www.curious-creature.org/2012/12/01/android-performance-case-study/)
2. http://blog.csdn.net/yihongyuelan/article/details/12169647 反编译并添加gpu显示

3. http://developer.android.com/training/improving-layouts/optimizing-layout.html#Inspect 官网资料

4. http://developer.android.com/training/improving-layouts/reusing-layouts.html 官网资料

5. http://developer.android.com/training/improving-layouts/loading-ondemand.html 官网资料

6. http://developer.android.com/training/improving-layouts/smooth-scrolling.html 官网资料

7. http://developer.android.com/tools/help/hierarchy-viewer.html 官网关于hierarchy view的介绍

8. http://tools.android.com/tips/lint lint工具介绍

作者：Gracker
出处：androidperformance.com
本文版权归作者所有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文连接，否则保留追究法律责任的权利。
打赏一下： 微博打赏