이 페이지에서는 시각적 트리에서 요소를 관리하는 베스트 프랙티스에 대해 설명합니다.
요소 풀링은 매번 new()로 요소를 생성한 후 놓아 두는 대신 나중에 다시 생성할 수 있는 요소를 보관하는 것입니다.
풀링하는 모든 요소를 완전히 제어하고 풀로 반환하기 전에 올바르게 재설정해야 합니다. 그렇지 않으면 풀링 시스템이 불안정해지고 문제가 발생할 수 있습니다. 예를 들어 이벤트 콜백을 등록하거나 직렬화되지 않은 내부 상태를 동시에 설정하는 동안 요소를 풀링하는 경우 요소를 정리할 수 없습니다.
시각적 요소의 수를 적게 유지하려면 가능한 경우 ListView를 사용하십시오. ListView는 요소를 풀링하고 사용자가 스크롤할 때 요소를 재활용합니다.
또는 ListView와 유사한 자체 풀 및 재활용 메커니즘을 구현하고 다음을 사용하여 표시되는 영역을 관리할 수 있습니다.
GeometryChangedEvent를 사용하십시오.VisualElement.layout 프로퍼티를 사용하십시오.
계층 구조에서 요소를 제거하고 레퍼런스를 제거하기 위해 VisualElement.RemoveFromHierarchy()를 사용하면 해당 요소가 가비지로 수집됩니다. 이렇게 하면 CPU와 GPU 비용이 0으로 줄어들고 상당한 양의 메모리를 확보할 수 있습니다. 하지만 요소를 재생성하고 계층 구조에서 다시 로드하는 작업은 느리고 비용이 많이 듭니다. 이를 방지하기 위해 계층 구조에서 요소를 미리 생성하고, USS 스타일 프로퍼티를 사용하여 요소를 숨기고, 필요한 경우에만 표시할 수 있습니다. 일반적으로 스타일을 적용하는 것이 속도가 더 빠르지만 동시에 여러 요소를 생성하면 메모리 사용량이 증가할 수 있습니다.
다음은 요소를 숨기는 다양한 방식과 프로세서 및 메모리 사용량에 미치는 영향에 대한 설명입니다.
visibility: hidden;으로 숨기기이 방식을 사용하면 자손이 visibility 스타일을 오버라이드할 수 있습니다.
다음 표는 visibility 스타일로 시각적 요소를 숨기거나 표시할 때 단일 프레임 비용의 다양한 측면에 대한 설명입니다.
| 종류 | visibility: hidden; |
visibility: visible; |
|---|---|---|
| 스타일 | 가시성을 전파하기 위해 요소와 자손에 대해 평가됨 | 요소와 자손에 대해 평가되어 가시성을 전파함 |
| 레이아웃 데이터 | 보존됨 | 없음 |
| 렌더링 커맨드 | 제거 및 할당 해제 | 다시 생성되고 커맨드 체인에 다시 삽입됨 |
| 메시 | 할당 해제 예약됨 | 다시 테셀레이션됨 |
다음 표는 visibility 스타일로 시각적 요소를 숨길 때 CPU 및 GPU의 프레임당 동작에 대한 설명입니다.
| 프로세서 | 종류| 프레임당 동작 | | — | — | — | | CPU | 스타일 | 요소와 해당 자손에 대해 완전히 평가됩니다. | | |레이아웃 데이터 | 업데이트됨| | |테셀레이션 | 스텐실 마스킹 메시에만 최소한의 영향을 미칩니다(해당하는 경우). | | |렌더링 커맨드 | 일반적으로 표시되는 지오메트리를 그리는 커맨드가 없습니다. 그러나 스텐실 마스킹 메시는 스텐실에서 푸시하거나 팝으로 렌더링되어 표시될 가능성이 높은 자손이 마스킹되도록 합니다. | | GPU |메시 | 스텐실 마스킹 메시의 버텍스 및 프래그먼트 셰이딩|
opacity: 0;로 숨기기이 방식을 사용하면 프래그먼트 셰이더가 모든 요소를 처리하므로 콘텐츠가 뷰포트에 있는 경우 GPU 사용량이 높아 상당한 오버드로우가 발생할 가능성이 높습니다.
다음 표는 opacity 스타일로 시각적 요소를 숨기거나 표시할 때 발생하는 단일 프레임 비용에 대한 설명입니다.
| 동작 | 단일 프레임 비용 |
|---|---|
opacity: 0; |
처음에 opacity를 1이 아닌 값으로 설정하면__ UI__(사용자 인터페이스) 사용자가 애플리케이션과 상호 작용하도록 해 줍니다. Unity는 현재 3개의 UI 시스템을 지원합니다. 자세한 정보See in Glossary 툴킷 렌더러가 버텍스를 수정하여 GPU에서 불투명도 적용을 가속화합니다. 그러면 일회성 CPU 비용이 최소화됩니다. 일반적으로 비용이 거의 없지만 요소에 자손이 많거나 수정할 버텍스가 많은 경우 이러한 비용이 눈에 띄게 될 수 있습니다. 시각적 트리에서 요소를 제거하고 다시 추가하지 않는 한 이 비용은 다시 발생하지 않습니다. |
opacity: 1; |
없음 |
다음 표는 opacity 스타일로 시각적 요소를 숨길 때 CPU 및 GPU의 프레임당 동작에 대한 설명입니다.
| 프로세서 | 종류| 프레임당 동작 |
| — | — | — |
| CPU |스타일 | 요소와 해당 자손에 대해 완전히 평가됩니다. |
|
|테셀레이션 | 정상적으로 작동하고 변경 사항에 반응합니다. |
|
|렌더링 커맨드 | 실행됨 |
| GPU | 메시 | 버텍스 셰이더는 visibility가 1로 설정된 것처럼 작동합니다. 마찬가지로 프래그먼트 셰이더도 visibility가 1인 것처럼 작동합니다. 이는 GPU에 부하가 집중된 프로젝트에서 오버드로우로 이어질 수 있으므로 문제가 될 수 있습니다. |
display: none;으로 숨기기이 방식을 사용하면 요소가 레이아웃 트리에서 제거된 것처럼 동작하여 다른 요소의 레이아웃에 영향을 줄 가능성이 높습니다.
다음 표는 display 스타일로 시각적 요소를 숨기거나 표시할 때 단일 프레임 비용의 다양한 측면에 대한 설명입니다.
| 종류 | display: none; |
display: flex; |
|---|---|---|
| 레이아웃 데이터 | 다른 요소의 레이아웃을 다시 계산할 수 있음 | 대기 중인 레이아웃 변경 사항이 처리됨 |
| 렌더링 커맨드/메시 | 레이아웃 변경에 영향을 받는 요소에 대해 다시 생성됨 |
|
다음 표는 display 스타일로 시각적 요소를 숨길 때 CPU의 프레임당 동작에 대한 설명입니다. GPU 비용은 없습니다.
| 종류 | 프레임당 동작 |
|---|---|
| 레이아웃 데이터 | 보존되지만, 무효화될 수 있고 업데이트되지 않을 수 있습니다. |
| 렌더링 커맨드 | 유지되지만, 실행 중에 건너뛸 수 있습니다. 건너뛰는 방법은 비용이 매우 적게 들지만 비용이 없는 것은 아닙니다. 비용은 커맨드 수에 비례합니다. |
| 메시 | 유지되지만, 무효화될 수 있고 업데이트되지 않을 수 있습니다. |
translate: -5000px -5000px;을 DynamicTransform 사용 힌트와 함께 사용하여 요소를 뷰포트 밖으로 이동할 수 있습니다. 지오메트리는 완전히 활성 상태로 유지되며 화면에 요소를 되돌리면 CPU 사용량이 최소화됩니다. 하지만 GPU는 버텍스를 계속 처리하며 시나리오에 따라 허용될 수 있습니다.
트랜스폼은 일반적으로 빠른 GPU 메모리에서 계산되고 업로드됩니다.
다음 표는 뷰포트 외부로 시각적 요소를 이동하여 숨길 때 CPU 및 GPU의 프레임당 동작에 대한 설명입니다.
| 프로세서 | 종류| 프레임당 동작 | | — | — | — | | CPU|스타일 | 업데이트됨 | | |레이아웃 날짜 | 업데이트됨 | | |드로우 콜 | 실행됨 | | GPU |메시 | 버텍스에 셰이드 처리가 수행됨 |
VisualElement.RemoveFromHierarchy() 메서드를 사용하여 계층 구조에서 요소를 제거하면 CPU 및 GPU 메모리를 확보하여 모든 컴퓨팅 비용을 제거할 수 있습니다.
다음 표는 계층 구조에서 시각적 요소를 숨기거나 표시할 때 발생하는 단일 프레임 비용에 대한 설명입니다.
| 종류 | 제거 | 추가 |
|---|---|---|
| 스타일 | 없음 | 하위 트리에 대해 업데이트됨 |
| 레이아웃 | 없음 | 하위 트리 및 다른 요소에 대해 다시 계산됨 |
| 렌더링 커맨드/메시 | 레이아웃 변경에 영향을 받는 요소에 대해 다시 생성됨 |
|
다음 표는 다양한 방식으로 요소가 숨겨진 후 메모리 사용량에 대한 요약입니다.
| 프로세서 |종류| visibility:hidden; | opacity:0; | display:None; | 뷰포트 외부로 이동됨 | 계층 구조에서 제거됨 |
| — | — | — | — | — | — | — |
| CPU |스타일 |유지됨 | 유지됨 | 유지됨 | 유지됨 | 해제됨 |
|
|레이아웃 | 유지됨 | 유지됨 | 유지됨 | 유지됨 | 유지됨[1] |
|
|렌더링 커맨드/메시 | 해제됨 | 유지됨 | 유지됨 | 유지됨 | 해제됨 |
| GPU |메시 | 해제됨 | 유지됨 | 유지됨 | 유지됨 | 해제됨 |
레이아웃 메모리는 요소에 예약된 상태로 남아 있기 때문에 유지됩니다. VisualElement가 가비지로 수집되면 레이아웃 메모리가 풀로 반환되어 다른 요소에서 사용할 수 있게 됩니다. ↩