最近在做项目的优化工作，测试发现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 1-20
- 其他atlas 21-40
- common 41-60
- 其他atlas 61-80
- common 81-100
这样设置了以后，是可以保证common图集的都合并到一个drawcall里的。
-
关于什么时候会重建DrawCall
重建主要有这么几种情况- UIWidget第一次更新的时候，没有找到对应的DrawCall
- UIPanel OnEnable的时候
- UIPanel OnInit的时候，即Start的时候
- 手动调用Refresh的时候 (尽量不要手动调用这个接口)
- 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; } }尽量减少重建，每一帧都重建是不能忍的。所以原则就是尽量不要改变同一个UIPanel下面的UIWidget的列表，增加，删除，改顺序都会重建DrawCall
-
关于什么时候会更新DrawCall,也就是DrawCall的Dirty
- 后加入的UIWidget找到之前的同样材质的DrawCall的时候
- UIWidget从以前的DrawCall中移除的时候
- 手动SetDirty的时候
- UIWidget UpdateGeometry的时候
其中主要是减少第4种情况，这里只要UIWidget的transform发生变化，或者color发生变化，都会重新填充当前的DrawCall
所以优化策略是把每帧都发生变化的UIWidget放在单独的DrawCall里，或者单独的UIPanel，就是所谓的动静分离
to be continued
专栏文章全都转移到知乎专栏了，欢迎关注，交流。
知乎专栏-程序员的自我修养
