# Rust로 작성된 즉시 모드 GUI, Egui

> Clean Markdown view of GeekNews topic #18453. Use the original source for factual precision when an external source URL is present.

## Metadata

- GeekNews HTML: [https://news.hada.io/topic?id=18453](https://news.hada.io/topic?id=18453)
- GeekNews Markdown: [https://news.hada.io/topic/18453.md](https://news.hada.io/topic/18453.md)
- Type: GN+
- Author: [neo](https://news.hada.io/@neo)
- Published: 2024-12-27T09:45:20+09:00
- Updated: 2024-12-27T09:45:20+09:00
- Original source: [egui.rs](https://www.egui.rs/)
- Points: 10
- Comments: 1

## Summary

Egui는 Rust로 작성된 즉시 모드 GUI 라이브러리로, 웹에서는 WebAssembly와 WebGL을 통해, 네이티브 환경에서는 다양한 플랫폼을 지원합니다. 이 라이브러리는 사용하기 쉽고 이식성이 뛰어나며 빠른 성능을 제공하도록 설계되었으며, 버튼, 슬라이더, 체크박스 등 다양한 위젯과 수평, 수직 레이아웃을 지원합니다. 즉시 모드(Immediate Mode)는 코드 흐름을 단순화하고 상태 동기화 문제를 해결하지만, 복잡한 레이아웃에서는 추가 작업이 필요하고 대규모 UI에서는 성능 저하가 발생할 수 있습니다.

## Topic Body

- egui는 Rust로 작성된 **즉시(Immediate Mode) 모드 GUI 라이브러리**로, 웹 및 네이티브 환경에서 동작  
- 웹에서는 WebAssembly로 컴파일되어 WebGL을 통해 렌더링되며, 네이티브 환경에서는 Mac, Linux, Windows 등 다양한 플랫폼을 지원  
- DOM, HTML, JS, CSS 없이 순수 Rust만으로 구현됨  
- **사용하기 쉽고**, **이식성이 뛰어나며**, **빠른 성능**을 제공하도록 설계됨  
  
### 주요 특징  
  
#### 1. 즉시 모드 (Immediate Mode)  
- GUI 생성이 단순화되고 코드 흐름이 간결해지는 방식  
- 예제:  
  ```rust  
  if ui.button("Save").clicked() {  
      my_state.save();  
  }  
  
-	버튼 상태를 저장하거나 콜백을 사용할 필요가 없음  
-	즉시 모드는 사용성을 높이고 복잡성을 줄이는 대신 레이아웃과 성능에서 약간의 제한이 있음  
  
## 2. 플랫폼 호환성  
-	웹: WebAssembly와 WebGL을 통해 동작  
-	네이티브: Mac, Linux, Windows, Android 등을 지원  
-	게임 엔진과 통합 가능 (예: Bevy와의 통합)  
  
## 3. Rust 생태계와의 통합  
-	공식 프레임워크 eframe 제공:  
-	동일한 코드로 웹 및 네이티브 애플리케이션 작성 가능  
-	경량 의존성:  
-	egui는 Rust의 ab_glyph, ahash 등 최소한의 의존성만 사용  
-	무거운 의존성은 별도의 crate로 분리 (egui_extras 등)  
  
# 주요 기능  
-	위젯: 버튼, 슬라이더, 체크박스, 라디오 버튼, 텍스트 편집, 색상 선택기 등  
-	레이아웃: 수평, 수직, 열 기반, 자동 줄바꿈 지원  
-	텍스트 편집: 멀티라인, 복사/붙여넣기, 이모지 지원  
-	윈도우: 이동, 크기 조정, 최소화/닫기  
-	렌더링: 안티앨리어싱 적용된 텍스트, 도형 렌더링  
-	접근성: AccessKit 통합으로 스크린 리더 지원  
  
# 장점과 단점  
  
- 장점  
  -	단순성: 콜백 없이 간결한 코드로 GUI 작성 가능  
  -	이식성: 동일한 코드로 웹 및 네이티브 환경에서 실행 가능  
  -	사용성: 애플리케이션 상태와 GUI 상태 간의 동기화 문제가 없음  
- 단점  
  -	레이아웃 복잡성: 즉시 모드의 특성상 복잡한 레이아웃에는 추가 작업 필요  
  -	CPU 사용량: 매 프레임 전체 레이아웃 계산이 필요하므로 대규모 UI에서는 성능 저하 가능  
  
# 대상 사용자  
-	간단한 GUI를 빠르게 작성하려는 개발자  
-	Rust 기반 게임 엔진이나 프로젝트에 GUI를 추가하려는 사용자  
-	웹 및 네이티브 환경 모두를 지원하는 애플리케이션 작성자  
  
# 즉시 모드에 대한 추가 설명  
-	즉시 모드는 콜백 기반의 **보유 모드(retained mode)**와 달리, 프레임마다 상태를 즉각적으로 처리  
-	예제: if ui.button("Save").clicked() { save(); }  
-	장점: 코드 흐름이 단순해지고 상태 동기화 문제가 없음  
-	단점: 레이아웃 계산이 복잡하며, 대규모 UI에서는 성능에 영향을 줄 수 있음

## Comments



### Comment 32721

- Author: neo
- Created: 2024-12-27T09:45:20+09:00
- Points: 1

###### [Hacker News 의견](https://news.ycombinator.com/item?id=42512636) 
- Rust 프레임워크를 사용하여 수학 문제를 이해하려 했으나, edit-compile-run 사이클이 너무 길어 어려움을 겪음. 프로젝트를 모듈로 나누면 개선될 수 있을지 궁금함

- 브라우저가 서브 픽셀 렌더링을 지원하지 않으면, 캔버스 기반 UI 렌더링 라이브러리는 고해상도 기기를 제외하고는 DOM 기반에 비해 불리함. egui 라이브러리도 이 문제를 인식하고 있음

- 브라우저 환경에서 컴파일된 데모 페이지는 기술적으로 인상적이지만, egui를 사용한 앱의 가능성을 상상하기 어려움. egui를 활용한 재미있는 예시가 있는지 궁금함

- 크리스마스에 naughty한 행동으로 Option을 패턴 매칭 대신 강제로 언랩하여 에러 발생. Brave 모바일 버전에서 발생함

- 국제화 지원이 제한적임. 예를 들어, 아랍어 "hello"를 붙여넣으면 네모 상자로 표시됨

- "즉시 모드"가 무엇인지 궁금함. 위젯을 UI에 추가하는 방법이 .add()를 사용함. 이러한 위젯에 대한 유창한 빌더 API가 "즉시 모드"로 만드는 것인지 궁금함

- 웹 브라우저에서 이러한 인터페이스를 디버깅하는 방법이 궁금함. JavaScript나 C++ 웹 어셈블리처럼 디버깅할 수 있는지 궁금함

- 창 크기 조정에 문제가 있음. "Highlighting" 예시에서 하단 오른쪽 모서리의 잡기 영역을 클릭하면 대각선 화살표가 수직 화살표로 바뀌어 수직으로만 크기 조정이 가능함. 다른 기본 예시에서도 수직 및 수평으로 동시에 크기 조정이 가능할 것 같지만, 수직으로 조정할 수 없음

- 입력 반응이 매우 느림. 빠르게 타이핑하면 입력이 따라오지 못함. 텍스트 선택 및 복사가 불가능하여 사용자 정의 GUI 구현에 큰 문제임. 모두에게 행복한 연말을 기원함