最近在做项目的优化工作,测试发现UI的开销占到了一半以上,所以先从他下手。

 

 
 

源码分析

 

NGUI有几个重要的类,UIPanel,UIWidget,UIDrawCall。其中UIPanel用一个静态链表保存游戏里的所有UIPanel,每个UIPanel在列表里的顺序是由depth决定的,注意这里是静态链表,并没有父子关系。

 

public int depth

{

    get

    {

        return mDepth;

    }

    set

    {

        if (mDepth != value)

        {

            mDepth = value;

#if UNITY_EDITOR

            NGUITools.SetDirty(this);

#endif

            list.Sort(CompareFunc);

        }

    }

}

 

每一个UIPanel用一个list保存所有的UIWidget, 顺序是先按照depth排,depth相同再按照材质排

 

public void SortWidgets ()

{

    mSortWidgets = false;

    widgets.Sort(UIWidget.PanelCompareFunc);

}

 

static public int PanelCompareFunc (UIWidget left, UIWidget right)

{

    if (left.mDepth < right.mDepth) return -1;

    if (left.mDepth > right.mDepth) return 1;

 

    Material leftMat = left.material;

    Material rightMat = right.material;

 

    if (leftMat == rightMat) return 0;

    if (leftMat != null) return -1;

    if (rightMat != null) return 1;

 

    return (leftMat.GetInstanceID() < rightMat.GetInstanceID()) ? -1 : 1;

}

 

每个UIPanel管理自己的Drawcall

 

public List<UIDrawCall> drawCalls = new List<UIDrawCall>();

 

大概流程就是每一帧每个UIPanel去更新所有属于他的UIWidget,什么算属于,其实就是每个UIWidget去他的父节点里一直向上找,第一个找到的就是它属于的UIPanel

 

static public UIPanel Find (Transform trans, bool createIfMissing, int layer)

{

    UIPanel panel = null;

 

    while (panel == null && trans != null)

    {

        panel = trans.GetComponent<UIPanel>();

        if (panel != null) return panel;

        if (trans.parent == null) break;

        trans = trans.parent;

    }

    return createIfMissing ? NGUITools.CreateUI(trans, false, layer) : null;

}

 

更新UIWidget的过程, 就是准备UIDrawCall的过程,先去现有的DrawCall里面去找,如果找到材质相同,并且贴图相同,shader也相同的就认为可以放到一个DrawCall里,否则的话,就只能重建当前这个UIPanel的所有DrawCall

 

public UIDrawCall FindDrawCall (UIWidget w)

{

    Material mat = w.material;

    Texture tex = w.mainTexture;

    int depth = w.depth;

 

    for (int i = 0; i < drawCalls.Count; ++i)

    {

        UIDrawCall dc = drawCalls[i];

        int dcStart = (i == 0) ? int.MinValue : drawCalls[i - 1].depthEnd + 1;

        int dcEnd = (i + 1 == drawCalls.Count) ? int.MaxValue : drawCalls[i + 1].depthStart - 1;

 

        if (dcStart <= depth && dcEnd >= depth)

        {

            if (dc.baseMaterial == mat && dc.mainTexture == tex && w.shader == dc.shader)

            {

                if (w.isVisible)

                {

                    w.drawCall = dc;

                    if (w.hasVertices) dc.isDirty = true;

                    return dc;

                }

            }

            else mRebuild = true;

            return null;

        }

    }

    mRebuild = true;

    return null;

}

 

 

void UpdateSelf ()

{

    mUpdateTime = RealTime.time;

 

    UpdateTransformMatrix();

    UpdateLayers();

    UpdateWidgets();

 

    if (mRebuild)

    {

        mRebuild = false;

        FillAllDrawCalls();

    }

    else

    {

 

    ......

 

 
 

优化策略

 

  • UIPanel的数量一定要尽量少,UIPanel的数量一定要尽量少,UIPanel的数量一定要尽量少!
    这个主要是因为UIPanel之间的DrawCall是不会合并的,所以如果滥用UIPanel,DrawCall是永远不会降下来的

  • 同一个UIPanel下面的UIWidget的depth一定要有一个好的规划
    因为UIWidget的顺序是先depth,然后再材质,所以我们要尽量把同一个材质贴图的都放在同一个depth段里。这里以游戏中的主界面为例:
    因为主界面是大多数时候停留的界面,所以最值得优化,建议主界面下如果没有特殊需求的话,建议把所有静态的东西都放在一个UIPanel下。假设用到的shader都是半透明混合的shader,大部分的UI元素放到了一个公共的图集里common,其他的有atlas1,atlas2等等,还有文字用到的贴图font1,font2,主界面尽量不要出现文字在贴图下面的情况,这样由源码分析可知,我们要尽量把同一个atlas的放在一起,这里主要围绕着common来,因为其他的贴图很可能根据游戏逻辑变化,depth范围如下这样设置了以后,是可以保证common图集的都合并到一个drawcall里的。

    1. common 1-20

    2. 其他atlas 21-40

    3. common 41-60

    4. 其他atlas 61-80

    5. common 81-100

  • 关于什么时候会重建DrawCall
    重建主要有这么几种情况尽量减少重建,每一帧都重建是不能忍的。所以原则就是尽量不要改变同一个UIPanel下面的UIWidget的列表,增加,删除,改顺序都会重建DrawCall

    1. UIWidget第一次更新的时候,没有找到对应的DrawCall

    2. UIPanel OnEnable的时候

    3. UIPanel OnInit的时候,即Start的时候

    4. 手动调用Refresh的时候 (尽量不要手动调用这个接口)

    5. UIWidget从UIPanel上移除,并且是DrawCall depth开始或者结束的时候

 

public void RemoveWidget (UIWidget w)

{

   if (widgets.Remove(w) && w.drawCall != null)

   {

       int depth = w.depth;

       if (depth == w.drawCall.depthStart || depth == w.drawCall.depthEnd)

           mRebuild = true;

 

       w.drawCall.isDirty = true;

       w.drawCall = null;

   }

}

 

  • 关于什么时候会更新DrawCall,也就是DrawCall的Dirty其中主要是减少第4种情况,这里只要UIWidget的transform发生变化,或者color发生变化,都会重新填充当前的DrawCall所以优化策略是把每帧都发生变化的UIWidget放在单独的DrawCall里,或者单独的UIPanel,就是所谓的动静分离

    1. 后加入的UIWidget找到之前的同样材质的DrawCall的时候

    2. UIWidget从以前的DrawCall中移除的时候

    3. 手动SetDirty的时候

    4. UIWidget UpdateGeometry的时候