주요 내용으로 건너뛰기

일반 UI 구성요소 성능

이 섹션에서는 대부분의 UI 구성요소에서 사용되는 일반 TouchGFX 렌더링 연산의 성능에 대해 알아봅니다.

이미지 그리기

이미지 그리기는 TouchGFX에서 가장 기본적인 그리기 연산 중 하나입니다. 거의 모든 UI 구성요소가 이미지를 어느 정도까지 1개 이상 그려야 하기 때문입니다. 따라서 시스템에서 이미지를 효율적으로 빠르게 그릴 수 있는 성능이 매우 중요합니다. 이미지 그리기의 성능에 영향을 미치는 요인은 많습니다. 하지만 거의 모든 하드웨어 구성에서 TouchGFX 이미지 그리기는 다른 그리기 연산에 비해 빠른 연산으로 알려져 있습니다.

데이터 복사에 대한 하드웨어 지원

TouchGFX는 비압축 이미지 데이터를 선택된 이미지 형식(예: RGB565, L8, ARGB8888)으로 저장합니다. 비압축 형식은 대부분의 경우 TouchGFX가 이미지를 직접 사용해 수정 없이 프레임버퍼로 전송할 수 있다는 이점이 있습니다. MCU에 DMA가 있으면 전송 속도가 빨라지고 MCU 부하가 최소화되므로 DMA를 메모리 복사에 활용할 수 있고, 또 활용해야 합니다.

단, 이미지 형식에 알파 채널이 포함되어 있다면 이러한 방식도 제약이 따릅니다. 이때는 정상적인 DMA 전송을 이용할 수 없는데, MCU가 이미지 데이터와 프레임버퍼 픽셀을 혼합하는 픽셀 블렌딩을 수행해야 하기 때문입니다. 하지만 Chrom-ART / DMA2D와 같은 그래픽 가속 기능을 지원하는 STM32를 사용한다면 이러한 유형의 이미지에서도 DMA를 이용할 수 있습니다. DMA가 단순히 데이터를 복사하는 데 그치지 않고 복사와 블렌딩 연산을 한 번에 처리하기 때문에 속도를 개선하고 MCU 부하를 크게 줄일 수 있습니다.

이미지 형식

이미지 형식은 하드웨어 지원에 따라 이미지 그리기 성능에도 영향을 미칩니다. 대체로, 전송할 데이터의 양이 적을수록 빠르게 전송할 수 있습니다. 따라서 비슷한 RGB888과 비교했을 때 RGB565 이미지 형식의 전송 속도가 더 빠른데, 이는 RGB565 이미지가 RGB888 이미지 크기의 2/3에 불과하기 때문입니다.

이미지 데이터에 대한 액세스

이미지를 렌더링할 때마다 이미지 데이터에 액세스하게 되므로 이미지 데이터에 액세스하는 데 소요되는 시간이 매우 중요합니다. TouchGFX 애플리케이션에서 이미지 데이터는 액세스 소요 시간에 따라 각기 다른 하드웨어 위치에 저장할 수 있습니다.

이미지 데이터 위치설명
외장 플래시외장 플래시는 가격이 저렴하고 크기가 작다는 이점이 있습니다. 대용량인 경우가 많기 때문에 애플리케이션에 이미지를 많이 저장할 수 있습니다. 물론 액세스 시간에는 큰 차이가 있지만 QSPI나 비슷한 대안을 선택한다면 처리량을 높여 이미지 그리기 성능을 크게 개선할 수 있습니다.
외장 RAM경우에 따라 이미지를 외장 RAM에 캐싱해야 할 수도 있습니다. TouchGFX에서 이미지 렌더링에 바로 사용할 수는 없지만 어쩔 수 없이 비 메모리 매핑 플래시(NAND, EMMC 등)를 사용해야 할 때가 그렇습니다. 이때는 애플리케이션의 이미지 그리기 성능을 위해 외장 RAM에 대한 액세스가 필요합니다.
내장 플래시저장 공간이 매우 한정적이지만 이미지 일부 또는 전부를 내장 플래시에 저장해야 하는 경우도 있습니다. 액세스가 매우 빠르기 때문입니다. 따라서 애니메이션에 반드시 필요한 이미지가 있지만 성능이 중요하다면(예: Texture Mapper에서 사용되는 경우) 가급적 내장 플래시에 저장하는 것이 좋습니다.
내장 RAM매우 드물지만 내장 RAM에서 이미지를 렌더링하기도 합니다. 저장 공간은 매우 한정적이지만 액세스 속도가 매우 빠르기 때문에 여기에 저장되는 이미지(TouchGFX 이미지 캐싱 기능 사용)는 아주 빠르게 렌더링 됩니다.

프레임버퍼에 대한 액세스

이미지 렌더링은 항상 프레임버퍼의 업데이트로 이어집니다. 이미지에 알파 채널이 포함되어 있으면 데이터 작성에서 그치지 않고 프레임버퍼의 픽셀 데이터를 읽어와서 블렌딩까지 실행하기 때문입니다. 따라서 높은 이미지 그리기 성능을 달성하려면 프레임버퍼 저장에 사용되는 RAM에 대한 읽기/쓰기 액세스 시간이 관건입니다.

이미지 해상도

전송할 데이터는 이미지의 해상도에 비례하므로 이미지 해상도는 자연히 이미지 그리기 연산에 영향을 미칩니다.

투명도

이미지 불투명도는 이미지 렌더링 시간에 영향을 미칩니다. 알파 값이 있는 이미지는 프레임버퍼와 블렌딩되어야 하기 때문에 알파 값이 없는 이미지보다 렌더링 시간이 깁니다. 따라서 블렌딩 연산을 위해 프레임버퍼에서 데이터를 읽어와야 하는 반면, 불투명 이미지일 때는 단순히 데이터를 프레임버퍼에 덮어쓰기만 하면 됩니다. 이는 하드웨어 가속 기능이 지원되는 경우에도 마찬가지입니다. 다만, 불투명 이미지와 반투명 이미지의 비율은 하드웨어 구성에 따라 다를 수 있습니다.

MCU의 그리기 작업

일부 위젯은 직접 프레임버퍼를 조작하는 데에 의존합니다. 이러한 방식에서는 무효화 영역의 각 픽셀마다 계산을 1회 이상 수행하여 프레임버퍼의 픽셀을 업데이트합니다. 이 경우 연산 속도가 다소 느린데, 각 픽셀마다 계산이 복잡한 경우에는 더욱 그렇습니다.

MCU의 그리기 작업에서 계산 작업이 많다면 MCU 처리 성능이 매우 중요합니다. 프레임버퍼에 대한 액세스(내장 또는 외장 RAM에 대한 액세스) 역시 영향을 미치는데, 이는 무효화 영역에서 각 픽셀마다 프레임버퍼 데이터를 작성하기 때문입니다(판독하는 경우도 있음).

Canvas Widgets

캔버스 위젯은 특수한 유형의 TouchGFX 위젯으로, 안티앨리어싱 처리된 기하 형상을 드로잉하는 데 사용됩니다. 이는 일반적으로 상당히 복잡하기 때문에 렌더링 속도가 매우 느려질 수 있습니다.

또한 렌더링 시간은 기하 형상에서 무효화 영역의 크기에 비례합니다.

캔버스 위젯에는 중간 계산 결과를 저장하는 메모리 블록이 필요합니다. 크기와 성능이 미치는 영향은 캔버스 위젯 섹션에 설명되어 있습니다.

Tip
대부분의 표준 TouchGFX 캔버스 위젯(Circle 등)에는 위젯에서 바뀐 영역만 무효화하는 업데이트 메소드가 있습니다. 따라서 Circle과 같은 위젯을 업데이트하는 경우 circle::updateArc(...)메소드를 사용하면 전체 영역이 아닌 바뀐 영역만 무효화됩니다. 최적의 성능을 원한다면 반드시 이러한 유형의 연산을 사용하십시오.

텍스트

텍스트 렌더링은 이미지 그리기의 영향을 많이 받는데, 그 이유는 텍스트 섹션에 설명된 것처럼, 사용된 문자가 전부 이미지로 변환되기 때문입니다. 이미지는 A4 형식으로, 기본적으로 각 이미지 픽셀마다 4비트 알파 값을 갖습니다. 이 패턴에 색상을 적용하면 문자 이미지가 안티앨리어싱 처리됩니다.

텍스트 렌더링은 각 문자마다 하나씩 실행되는 이미지 그리기 연산의 집합이므로, Chrom-ART / DMA2D와 같은 하드웨어 가속 기능을 사용한 성능 개선을 포함해 이미지 그리기에 대한 성능 특성이 텍스트 렌더링에도 적용됩니다.