性能優(yōu)化工具知識梳理(1) - TraceView
性能優(yōu)化工具知識梳理(2) - Systrace
性能優(yōu)化工具知識梳理(3) - 調(diào)試GPU過度繪制 & GPU呈現(xiàn)模式分析
性能優(yōu)化工具知識梳理(4) - Hierarchy Viewer
性能優(yōu)化工具知識梳理(5) - MAT
性能優(yōu)化工具知識梳理(6) - Memory Monitor & Heap Viewer & Allocation Tracker
性能優(yōu)化工具知識梳理(7) - LeakCanary
性能優(yōu)化工具知識梳理(8) - Lint

一顷窒、概述

今天钝满，介紹兩個比較簡單的性能優(yōu)化工具：

• 調(diào)試GPU過度繪制
• GPU呈現(xiàn)模式分析

其實這兩個工具所解決的問題并不相同，之所以把它們放在一起而晒，是因為它們都是Android手機自帶的分析工具鸦难，我們只要在設置中對應的開關(guān)珍语，就可以實時獲得分析的結(jié)果强衡，下面，我們就一起來看一下如何使用它們合呐。

二暮的、調(diào)試GPU過度繪制

2.1 應用場景

這個工具主要是用來檢查布局中是否存在布局層次過深的問題。
首先淌实，說明一下什么叫過度繪制冻辩，過度繪制指的是屏幕中同一個像素點被繪制了多次，舉個例子翩伪，我們有一個紅色ViewB，它先被繪制了一次谈息，也就是說它所在區(qū)域的每個像素點都被繪制成了紅色缘屹，這時候有一個藍色ViewA，它蓋在ViewB的上面侠仇，所以我們需要再把每個像素點都繪制成藍色轻姿，這其實是不必要的犁珠，出現(xiàn)這種情況的時候，我們就可以通過這個工具來避免這種情況的發(fā)生互亮。

2.2 使用方式

使用方式很簡單犁享，進入設置/輔助功能/開發(fā)者選項/，點擊調(diào)試GPU過度繪制選項豹休，在彈出框中選擇第二項：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="browser.android.com.repoperformance.OverDrawActivity">
    <FrameLayout
        android:id="@+id/fl_1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginBottom="100dp"
        android:background="@android:color/white">
        <FrameLayout
            android:id="@+id/fl_2"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginBottom="100dp"
            android:background="@android:color/white">
            <FrameLayout
                android:id="@+id/fl_3"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginBottom="100dp"
                android:background="@android:color/white">
                <FrameLayout
                    android:id="@+id/fl_4"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:layout_marginBottom="100dp"
                    android:background="@android:color/white">
                    <FrameLayout
                        android:id="@+id/fl_5"
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:layout_marginBottom="100dp"
                        android:background="@android:color/white"/>
                </FrameLayout>
            </FrameLayout>
        </FrameLayout>
    </FrameLayout>
</RelativeLayout>

我們布局呈現(xiàn)為逐級嵌套的層次彰檬，并且從fl_1開始都有一個白色的背景，那么我們看一下打開了調(diào)試GPU過度繪制開關(guān)之后的結(jié)果：

從上面的圖中可以看到谎砾，fl_1的白色繪制是正常的逢倍，而fl_2和fl_1在由于有100dp的重疊區(qū)域，因此這部區(qū)域被檢測成為了藍色棺榔，而fl_3和fl_1/fl_2都有重疊瓶堕，因此這部分區(qū)域被檢測成為了綠色，fl_4和fl_5也是同理症歇。
通過上面的例子郎笆，可以看到檢測的結(jié)果分為四個等級，從低到高分別是：

• 藍色
• 綠色
• 淺紅
• 深紅

在開發(fā)當中忘晤，我們在設計完界面之后宛蚓，就應當通過這個工具來檢測一下，看能否在保證實現(xiàn)功能的前提下设塔，避免出現(xiàn)過度繪制凄吏。

三、GPU呈現(xiàn)模式分析

3.1 應用場景

當打開這個工具之后闰蛔，會在屏幕的底端展現(xiàn)當前界面的繪制情況痕钢，GPU呈現(xiàn)模式分析有以下幾點作用：

• 查看每一幀的渲染是否達到16ms的要求
• 分析一幀的渲染過程各階段的耗時
• 因為它是實時展現(xiàn)的，因此我們可以快速到問題產(chǎn)生的原因

這個工具的使用方法和上面類似序六，同樣是進入開發(fā)者選項中任连，然后點擊GPU呈現(xiàn)模式分析，選擇“在屏幕上顯示為條形圖”例诀。

3.2 使用詳解

在Android 6.0之前和之后随抠，GPU呈現(xiàn)的模式會有所不同裁着，區(qū)別在于6.0之后，它將整個繪制的階段更加細分拱她，讓開發(fā)者能夠更方便的定位問題二驰。

• 基礎
  無論是在6.0之前還是之后，這個工具的原理都是相同的秉沼。因為系統(tǒng)每隔16ms就會發(fā)出一次VSYNC信號桶雀，通知刷新UI，如果在16ms之內(nèi)沒有完成繪制氧猬，那么就必須等到下一次背犯，這就會導致在很長一段時間內(nèi)，看到的都是同一個畫面盅抚，也就是我們所說的”卡頓”漠魏，界面的展示就是基于這個原理：

• 柱狀圖：柱狀圖的每一根的高度就表示渲染這一幀的耗時，當渲染的時間越長妄均，則柱狀圖的高度越高柱锹。

• 基準線：我們在界面上并不能看到柱狀圖對應的時間，而是通過在柱狀圖上方的基準線來判斷是否超過了標準的時間丰包，基準線對應的就是16ms禁熏，如果柱狀圖的高度在基準線的下方，那么就表示這一幀繪制的時間小于16ms邑彪。

• Android 6.0之前
  在這個6.0版本之前瞧毙，我們將柱狀圖分為以下幾個部分：
  

• 藍色Update
  這部分代表View創(chuàng)建和更新DisplayList的時間，如果這部分很高寄症，那么表示我們有很多自定義的View宙彪，或者在onDraw當中進行了過于復雜的操作。

• 紫色XFer
  這部分在Android 4.0之后才有有巧，表示將資源傳遞到渲染線程所花的時間释漆。

• 紅色Execute
  這部分代表Android 2D渲染器向OpenGL發(fā)送命令來繪制和重繪的時間，這些命令就是來自于前面生成的Display List篮迎，如果這部分很高男图，那么說明執(zhí)行Display Lists中的命令花費了很多的時間。

• 黃色Process
  這部分代表了CPU等待GPU完成操作所花的時間甜橱，如果這部分很高逊笆，那么說明GPU當前很忙碌。

從上面的解釋當中岂傲，我們可以發(fā)現(xiàn)难裆，雖然說這個工具的名字叫做GPU呈現(xiàn)模式分析，但是我們獲得的所有信息都是來自CPU的譬胎，也就是說差牛，我們是從CPU的角度來間接地分析出當前渲染需要處理的信息。

整個渲染的過程是通過CPU向GPU發(fā)出命令堰乔，再由GPU去異步地渲染屏幕偏化。在某些情況下，由于GPU有太多的工作要做镐侯，那么就會導致CPU需要一直等待才能發(fā)出新的命令侦讨，而當這種情況發(fā)生的時候，我們就會看到橙色和紅色的部分特別長苟翻。

關(guān)于6.0之前各顏色的解釋來自于官方文檔：

http://android.xsoftlab.net/tools/performance/profile-gpu-rendering/index.html

• Android 6.0之后
  在Android 6.0 之后韵卤，變?yōu)榱爽F(xiàn)在的八個部分：
  
  
  其中，如果新增部分的圖形高度較高崇猫，那么表示：
  • Misc/Vsync Delay
    我們在主線程當中執(zhí)行了過多的操作沈条，導致跟不上VSYNC信號。
  • InputHandling
    我們在處理用戶輸入的地方做了過多的操作诅炉。
  • Animation
    我們在執(zhí)行動畫的過程中進行了耗時的操作蜡歹。
  • Measure & Layout：
    我們的布局過于復雜，以至于在測量和布局的過程中耗費了過多的時間涕烧。
  • Sync & Upload：
    準備當前界面中有待繪制的圖片所耗費的時間過長月而。

6.0之前所保留下來的對應關(guān)系為：

關(guān)于6.0之后各顏色的解釋來源于：

http://hukai.me/android-performance-patterns-season-5/

四、小結(jié)

這篇文章议纯，主要還是著重于介紹如何使用這兩個工具父款，因此，關(guān)于整個渲染的原理也只是一筆帶過瞻凤，之后會專門詳細的分析憨攒。

更多文章，歡迎訪問我的 Android 知識梳理系列：

• Android 知識梳理目錄：http://www.reibang.com/p/fd82d18994ce