유니티 UI 최적화: 캔버스(Canvas) 분할을 통한 드로우콜 절감

캔버스 리빌드(Canvas Rebuild)의 공포

유니티 UI(uGUI) 시스템에서 가장 큰 성능 병목 중 하나는 'Canvas Rebuild'입니다. 캔버스는 내부에 포함된 UI 요소 중 단 하나라도 위치, 크기, 색상 등이 변경되면 해당 캔버스에 속한 모든 UI 요소의 메쉬를 다시 계산하여 생성합니다. 이를 리빌드라고 부릅니다.

만약 수백 개의 아이콘이 있는 인벤토리 UI에서 캐릭터의 체력 바 하나가 매 프레임 움직인다면, 유니티는 매 프레임마다 그 수백 개의 아이콘 메쉬를 모두 다시 계산하게 됩니다. 이는 CPU 점유율을 급격히 높이는 원인이 됩니다.

해결책: 캔버스 분할(Dividing Canvases)

가장 효과적인 최적화 방법은 '정적 UI'와 '동적 UI'를 서로 다른 캔버스에 배치하는 것입니다. 캔버스는 계층 구조(Hierarchy) 상에서 자식 캔버스를 가질 수 있는데, 자식 캔버스에서 발생하는 리빌드는 부모 캔버스에 영향을 주지 않습니다.

• Static Canvas: 배경, 라벨 등 절대 변하지 않는 요소들.
• Dynamic Canvas: 체력 바, 타이머, 애니메이션이 적용된 버튼 등 자주 변하는 요소들.

이렇게 분리하는 것만으로도 대규모 UI 시스템에서 CPU 부하를 50% 이상 줄일 수 있습니다.

그래픽 레이캐스터(Graphic Raycaster) 최적화

마우스 클릭이나 터치 입력을 감지하는 Graphic Raycaster 컴포넌트는 모든 UI 요소를 검사합니다. 하지만 배경 이미지나 단순 텍스트처럼 상호작용이 필요 없는 UI 요소들까지 검사할 필요는 없습니다.

상호작용이 필요 없는 모든 이미지와 텍스트 컴포넌트에서 'Raycast Target' 옵션을 체크 해제하세요. 또한, 클릭이 전혀 발생하지 않는 캔버스라면 Graphic Raycaster 컴포넌트 자체를 제거하는 것이 좋습니다.

// 런타임에 레이캐스트 타겟을 동적으로 제어하는 예시
using UnityEngine.UI;

public class UITools : MonoBehaviour {
    public void SetRaycastTarget(GameObject obj, bool enabled) {
        Graphic g = obj.GetComponent<Graphic>();
        if (g != null) {
            g.raycastTarget = enabled;
        }
    }
}

레이아웃 그룹(Layout Groups)의 함정

Vertical Layout Group이나 Grid Layout Group은 매우 편리하지만, 성능 면에서는 최악입니다. 이들은 내부 요소가 변경될 때마다 OnRectTransformDimensionsChange를 호출하며 연쇄적인 리빌드를 유발합니다.

동적으로 변하는 리스트가 아니라면, 레이아웃 그룹으로 배치를 마친 뒤 컴포넌트를 비활성화하거나 제거하는 것이 좋습니다. 만약 동적 리스트가 필요하다면, 스크립트를 통해 직접 위치를 계산해주는 것이 훨씬 빠릅니다.

// 레이아웃 그룹 대신 단순 루프로 위치 잡기
public void SetupSimpleList(RectTransform[] items, float spacing) {
    float currentY = 0;
    for (int i = 0; i < items.Length; i++) {
        items[i].anchoredPosition = new Vector2(0, currentY);
        currentY -= (items[i].rect.height + spacing);
    }
}

UI 숨기기: SetActive vs Canvas Group

UI를 숨길 때 gameObject.SetActive(false)를 사용하면 해당 UI가 다시 켜질 때 캔버스 리빌드와 OnEnable 비용이 발생합니다. 자주 껏다 켰다 하는 UI라면 다음과 같은 대안을 고려해 보세요.

• Canvas Group: Alpha를 0으로 조절하고 blocksRaycasts와 interactable을 false로 설정합니다. 리빌드를 유발하지 않으면서 시각적으로만 숨깁니다.
• Layer 전환: UI 레이어가 아닌 보이지 않는 레이어로 변경합니다.
• Canvas Disable: Canvas 컴포넌트 자체를 끕니다. 드로우콜은 사라지지만 상태는 유지됩니다.

심화 분석: 기술적 도전과 해결책

기술적 구현의 디테일

구현 시에는 싱글톤 패턴의 남용을 자제하고, 이벤트 기반의 시스템 아키텍처를 도입하여 클래스 간 결합도를 낮췄습니다. 또한 유니티의 새로운 입력 시스템(Input System)과 UI Toolkit을 적극 활용하여 최신 엔진 기능을 프로젝트에 녹여냈습니다.

유니티 엔진의 강력함은 유연한 컴포넌트 시스템에 있지만, 이는 반대로 과도한 의존성을 유발할 수 있습니다. 스크립터블 오브젝트(ScriptableObject)를 활용한 아키텍처는 데이터와 로직을 분리하여 유지보수성을 높여줍니다.

성능 벤치마크 및 최적화 지표

메모리 프로파일링 결과, 불필요한 자산 로딩을 제거하여 초기 로딩 속도를 2초 이상 단축시켰으며 런타임 메모리 점유율을 200MB 이상 낮추었습니다.

실무 적용 시 주의사항

어드레서블(Addressables) 시스템을 적극 도입하여 자산 관리의 자동화를 꾀하세요. Resources 폴더 사용은 가급적 지양하는 것이 좋습니다.

결론: 프로파일러를 믿으세요

최적화의 기본은 측정입니다. 유니티의 UI Profiler를 열어 어떤 요소가 리빌드를 유발하는지, 드로우콜(Batches)이 얼마나 발생하는지 수시로 확인해야 합니다. 캔버스 분할은 단순하지만 가장 강력한 도구입니다. 지금 바로 여러분의 프로젝트에서 캔버스 구조를 점검해 보세요!

LYSC Studio

1인 게임 개발과 웹 기술에 관심이 많은 개발자입니다. 경험을 통해 배운 것을 공유하고, 함께 성장하는 것을 즐깁니다.