HTML 과 CSS 로 쓴 Dioxus,Compose 가 네이티브로 그립니다.
웹에서 쓰듯 앱을 씁니다. div, h1, flexbox, 스타일시트, 훅과
시그널입니다. dioxus-compose 가 Rust 에서 배치하고, 그 결과를 compose-rust 를 거쳐 Compose
Multiplatform 이 그리도록 넘깁니다.
배포하는 프로그램에 웹뷰도 JVM 도 없습니다. rsx! 안에서 Compose 위젯
이름도 씁니다.
- 웹뷰 없음
- 배포 바이너리에 JVM 없음
- 쓰던 CSS 를 Rust 에서 배치
- 한글 포함 플랫폼 IME 그대로
rsx! {
main { class: "page",
h1 { "Hello, Dioxus" }
p {
a {
href: "#",
onclick: move |event| {
event.prevent_default();
hellos += 1;
},
"Say hello"
}
}
}
}CSS 는 Rust 에서, 픽셀은 Compose 에서
blitz-dom 이 Rust 프로세스 안에서 스타일시트를 풀고 페이지를 배치합니다. Dioxus 자체의 네이티브 렌더러가 쓰는 엔진과 같습니다. Compose 가 받는 것은 CSS 가 아니라 사각형, 색, 텍스트 조각이고, Compose 는 자기 텍스트 스택과 입력기로 그것을 그립니다.
지금 HTML 경로는 화면을 배치하고 그리기를 계획하며, 그것을 그리는 다리는 만들고 있습니다 (현황). 위젯 경로는 지금 그려집니다.
324 / 326VS Code 가 잰 텍스트 크기로, VS Code 와 1px 이내인 상자
11Host 에서 배치하고 테스트하는 HTML 과 CSS 예제
28.76 MBmacOS 에서 위젯 경로 앱 전체, 파일 하나
JVM 없음Java 가 없는 컴퓨터에서도 실행
VS Code 비교는 액티비티 바, 사이드바 트리, 에디터 탭이고 2026-10-03 macOS 에서 측정했습니다. 크기는 notepad 예제의 릴리스 빌드이고 Mac mini(M1)에서 쟀습니다.
현재 상태
| 부분 | 상태 |
|---|---|
| HTML 과 CSS: 레이아웃, 이벤트, 폼, 이미지, 스크롤 | 구현 Host 에서, 예제로 테스트 |
| HTML 과 CSS: 화면에 그리기 | 부분 렌더러 다리를 만드는 중(#43, #67) |
| Compose 로 텍스트 재기 | 부분(#43) |
| translate 밖의 CSS 변환, transition 과 animation | 계획(#46, #47) |
| 한 화면에 HTML 과 위젯 | 계획 |
rsx! 의 Compose 위젯 | 구현 macOS, Android, 웹에서 그려짐. Windows, Linux, iOS 는 빌드되고 시작됨 |
초기 단계 프로젝트이고 그렇다고 그대로 적습니다. 항목마다의 이슈는 현황 페이지에 있습니다.