记一次LGUI性能优化：同一个Canvas下大量UI元素的自动batch优化

本篇记录一下从LGUI3.1.1到LGUI3.1.2版本做的性能优化，主要用了四叉树优化了遮挡关系查询的部分。

LGUI从3.0版本开始去掉了Depth属性，改用层级顺序来自动管理渲染深度（以下称为AutoBatch），这样就需要自动计算各UI元素之间的遮挡关系。

AutoBatch依赖一些计算规则：当场景里有UI元素触发了AutoBatch的条件（位置、层级、材质、贴图等有变化）之后，遍历所有UI元素，判断层级和遮挡关系，贴图、材质相同的UI元素可拼合。其中判断遮挡关系这里，每个元素需要对已处理的所有的元素都判断遮挡，元素越多判断次数也越多，复杂度O(n)。这种情况可以当作二维场景碰撞检测，大部分的做法是四叉树。

下面用测试数据来对比。 以下测试都是在DevelopmentEditor编译模式下。
首先准备个测试场景如下图，场景里有1000个按钮，每个按钮由一个UISprite和一个UIText组成，总共由2000个UI元素，其中左下角有个按钮在场景里不停的移动（为了触发AutoBatch）。主要看“Canvas DrawcallBatch”参数
优化之前的AutoBatch的消耗是每一帧16ms左右：

优化之后的AutoBatch降到了1ms左右：

当然实际情况下不会这么夸张，大部分情况下场景里的UI不会有这么多，也不会有大量自动拼合的情况出现，所以一般使用的情况下不会有太大的性能差别。
具体做法并不复杂，每个drawcall中的物体都用四叉树管理，由UIQuadTree.h来实现。

测试场景的UE工程这里下载 ，在PerformanceTest文件夹里有两个场景1000Buttons和5000Buttons都可以用。

感谢这篇帖子给我的启发：Making the UI Backend Faster