Unity 之 UGUI 优化教程
全面解析 UGUI 在移动端的性能瓶颈与优化实战,助你把 UI 渲染时间压到 1 ms。
基于 Unity 2022.3 LTS,兼顾 2019+。文章结构遵循“定位 → 优化 → 验证”,示例脚本可在文末下载。
目录
前言
UGUI 简单易上手,却常因 重建脏矩形、多材质切换 导致帧率骤降。通过合理 拆 Canvas、合批、避免过度 Layout,可在真机上稳定 60 FPS,甚至 90 FPS (AR/VR)。
性能诊断
工具 | 关键指标 | 目标值 (移动端) | 说明 |
---|---|---|---|
Profiler → UI | Batches | < 40 | 渲染批次数 |
Vertices | < 50 k | Canvas 顶点总量 | |
Frame Debugger | SetPass | < 30 | 材质/Shader 切换 |
Overdraw 视图 | 红色区域 | < 2 层 | Alpha 叠加厚度 |
先测再改:
性能诊断 → 确认瓶颈 → 针对性改动 → 复测
。
Canvas 管理
拆分策略
UI 类型 | 推荐 Canvas | 刷新频率 |
---|---|---|
静态 (主菜单背景) | RootStaticCanvas | 几乎不变 |
低频动态 (背包列表) | ListCanvas | 1 fps 内 |
高频动态 (HP 条) | HUDCanvas | 每帧 |
- 合并脏区:关闭不用的
GraphicRaycaster
。 - 切勿对整个
Canvas
调SetActive
,改用CanvasGroup.alpha
。
避免重建
void LateUpdate()
{
if (needRefresh)
LayoutRebuilder.MarkLayoutForRebuild(rectTransform);
}
只重建必要节点,拒绝全量 ForceUpdateCanvases()
。
Draw Call 合批
- SpriteAtlas 同一图集自动合批;开启 Tight Packing。
- 材质共享:用
MaterialPropertyBlock
传动态色值,避免实例化材质。 - 动效 UI 建议 UIParticle 或 CanvasGroup + RenderTexture。
遮罩与剔除
方案 | 耗时 | 适用场景 |
---|---|---|
Mask (Stencil) |
高 | 多边形遮罩 |
RectMask2D |
中 | 矩形裁剪 |
AlphaClip Shader |
低 | 简单渐显 |
- 嵌套遮罩 ≤ 2 层;必要时在最外层使用 剪裁 Shader 代替
Mask
。
动态内容优化
TextMeshPro.SetText()
缓存 StringBuilder,数字跳动不 GC。- 快速位移用 AnchoredPosition3D;少用
ContentSizeFitter
。 - DOTween ⟹
DOFade/DOScale
取代 Animator,可节省 1 ms+。
事件系统优化
- Ignore Reversed Graphics:减少点击穿透计算。
- 合并大量 Button,统一派发
IPointerClickHandler
。 - 自定义 ICanvasRaycastFilter 精准过滤:
public bool IsRaycastLocationValid(Vector2 sp, Camera cam)
=> isVisible; // 逻辑可关
资源与图集
- UI Texture 使用 PNG8 或 ETC2 8bit,不必 mipmap。
- 大于 2048 图集拆分,否则 Android 内存跳增。
- AssetBundle:按场景/功能分包,初包 < 20 MB。
Shader & SRP Batcher
- URP 打开 SRP Batcher,99% UI Shader 已兼容。
- 自定义 UI Shader 保持 属性顺序一致,防止 Batch Break。
常见误区
“把所有 UI 放一个 Canvas”
重建耗时会成倍增长。
“强行合图”
大图集导致 GPU Cache Miss,得不偿失。
“LayoutGroup 随便用”
编辑器预烘焙,运行时禁用 Layout 组件。
调试工具速查
名称 | 价值 |
---|---|
UI Profiler 模块 | Canvas Build/Upload 时间 |
Unity UI Stats | DrawCall/SetPass/Vertices |
RenderDoc | GPU Overdraw |
UIEventProfiler.cs | Raycast 频率 |
结语
规划先行、定位精准、改动可控 是 UI 性能优化黄金三步。把这些原则融入 UI 规范和 Code Review,可从根源杜绝卡顿。祝开发顺利,帧率飙升!
附录 · 示例脚本
UIBottleneckChecker.cs
— 运行时监测 DrawCall、OverdrawRaycastBlocker.cs
— 动态屏蔽射线UIPerfStatsWindow.cs
— 帧内 UI 耗时可视化窗口
Last modified on 2025-06-09