일렉트론 이대로 괜찮은가?(w.Tauri)

이직한 회사에서 일렉트론으로 개발을 주로 하고 있는데 데스크탑 앱 개발을 할 때 사용하는 프레임워크가 일렉트로만 있을까? 하는 생각을 하다가 Tauri 프레임워크를 알게 되었습니다

 

따라서 오늘은 최근에 등장한 Tauri 프레임워크를 알아보면서 일렉트론과  어떤 게 다른지를 한번 알아보도록 하겠습니다

 

Tauri

https://tauri.app/ko/

Build smaller, faster, and more secure desktop applications with a web frontend | Tauri Apps

 

Tauri란?

Tauri는 Rust 언어 기반으로 하는 데스크톱 애플리케이션을 개발하기 위한 오픈 소스 프레임워크입니다

HTML, CSS, Javascript를 이용하여 사용자 인터페이스를 구축하고 Rust 언어를 사용하여 백엔드 로직을 처리합니다

 

Tauri는 보안, 경량 그리고 효율성을 중심으로 설계가 되었으며 기존 웹기술을 사용하여 데스크톱 애플리케이션을 쉽게 개발할 수 있습니다

 

또한 Tauri로 만든 앱은 일렉트론 기반 앱에 비해 더 적은 메모리와 디스크 공간을 사용하는 것으로 알려져 있습니다

이 프레임워크는 크로스 플랫폼 지원을 제공하며 윈도우, 맥, 리눅스에서 실행가능하고 현재 안드로이드, ios 플랫폼도 준비 중에 있습니다

 

TMI

Rust : 메모리 안정성과 성능 및 편의성에 중점을 둔 프로그래밍 언어, 가비지 컬렉터 없이 메모리 안정성을 제공하는 대표적인 언어이며 C++ 대체재로 등장했다

 

프로세스 구조

Tauri는 일렉트론 혹은 최신 웹 브라우저와 같은 다중 프로세스 구조를 사용합니다

그러면 왜 다중 프로세스 구조를 사용할까요?

 

초창기 GUI앱은 단일 프로세스를 사용해 연산을 수행하거나 화면을 그리고, 사용자 입력에 반응하는 것이 일반적이었습니다 그러나 이렇게 되면 오래 실행되는 연산으로 인해 사용자 인터페이스가 응답하지 않거나 오류가 발생 시 앱 전체가 망가질 수도 있습니다

이러한 단점을 극복하기 위해 여러 구성 요소를 여러 프로세스에서 실행하기 시작했고 이는 현대의 멀티 코어 CPU 활용을 개선하고 더 안전한 앱을 만들 수 있게 하였습니다

 

즉 하나의 구성 요소에서 문제가 발생하더라도 구성요소가 다른 프로세스들이랑 격리가 되어있기 때문에 전체 시스템에 영향을 주지 않습니다

 

또한 각 프로세스에 권한을 작업에 필요한 것만 갖도록 최소한으로 부여해 취약점 공격범위를 제한할 수 있습니다

이를 최소 권한의 원칙이라고 합니다 쉽게 생각하면

정원사가 집에 정원을 다듬으러 올 때 정원 열쇠만 주면 됩니다 굳이 집열쇠를 줄필요는 없는 거처럼 프로그램에도 같은 개념을 적용시킨 것입니다

 

코어 프로세스

타 우리 앱은 앱의 진입점처럼 기능하고 운영체제 전체에 대한 접근 권한을 갖는 유일한 구성 요소인 코어 프로세스를 가집니다 일렉트론에 메인 프로세스 역할을 하고 있습니다

 

응용프로그램의 창, 시스템 트레이, 알림 등을 만들고 조율합니다 또한 모든 프로세스 간의 통신은 코어 프로세를 거쳐서 전달하게 됩니다

코어 프로세스는 설정이나 데이터베이스 연결 등 전역 상태를 관리하는 책임을 갖습니다 이는 웹뷰 사이의 상태 동기화를 쉽게 만들고 민감한 정보를 보호합니다

 

타 우리에 코어 프로세스는 Rust기반으로 동작하며 Rust의 소유권(Ownership)이 훌륭한 성능을 유지하면서 메모리의 안정성을 보장하기 때문입니다

웹뷰 프로세스

코어 프로세스 자체로는 UI를 그리지 않습니다. 대신 운영체제가 제공하는 웹뷰 라이브러리를 이용하는 웹뷰 프로세스를 만들어서 사용하게 됩니다 웹뷰는 HTML, CSS, JavaScript를 실행하는 브라우저와 비슷한 환경입니다

 

즉 타 우리는 전통적인 웹 기반 기술 및 도구를 사용할 수 있습니다

 

또한 다른 유사한 프레임워크와 달린 웹뷰 라이브러리는 최종 실행 파일에 포함되지 않고 런타임에 동적을 연결됩니다 이로 인해 앱에 사이즈가 꽤나 작아지지만 전통적인 웹 개발에서처럼 플랫폼 간의 차이점을 염두에 두어야 합니다

 

프로세스 간의 통신

Tauri는 비동기 메시지 전송이라 불리는 특정한 종류의 프로세스 간 통신을 사용하고 요청과 응답이 간단한 데이터 표현으로 직렬화되어 프로세스 사이를 오갑니다

 

클라이언트 와 서버 간 통신에서 사용되는 패러다임과 비슷하기에 웹 개발 경험을 갖고 있다면 메시지 전송이라는 말이 친숙할 수도 있습니다

 

따라서 타 우리는 메시지를 받는 이가 올바르지 않은 요청을 거절하거나 무시할 수 있기에 공유된 메모리나 직접 함수 접근하는 것보다 안전한 기술입니다 예를 들어 Tauri 코어 프로세스가 요청이 악의적이라 판단하면 단순히 요청을 무시하고 해당하는 함수를 절대 실행하지 않을 수도 있습니다

 

이벤트

이벤트는 생애 주기 이벤트나 상태 변화 소통 등에 잘 맞는 보내면 끝인 단반향 IPC 메시지입니다 이벤트는 프런트 엔드 그리고 코어 프로세스 양측에서 보낼 수 있습니다

명령

명령은 Tauri에서 백엔드와 프론트엔드 사이에 데이터를 교환하는 메커니즘입니다 사용자는 자바스크립트를 통해 Rust함수를 호출할 수 있으며 이를 통해 두환경의 통신이 가능해집니다

 

 

일렉트론 과의 비교

Tauri와 일렉트론을 비교할 때 많이 나오는 부분은 메모리 사용량, 빌드 속도, 디스크 공간 절약 등이 있는데 과연 실제로도 많이 차이 나는지 비교해 보도록 하겠습니다

 

비교를 위하여 electron-react-bolierplate와 Tauri+react+typescript로 비교하였습니다

소스 코드에는 단순한 렌더러 프로세스에서 Hello만 나오도록 하였습니다

 

빌드 속도

Electron

electron-react-bolierplate에서는 대략 35초 정도에 빌드 속도를 보이고 있습니다

 

Tauri

반면 Tauri는 대략 23초 정도의 빌드 속도를 보이고 있습니다

 

따라서 Electron과 Tauri는 대략 약 34% 정도의 빌드 속도 차이를 보이고 있습니다

 

메모리 사용량

 

메모리 사용량 같은 경우는 타 우리가 약 55MB, 일렉트론이 약 62MB로 측정이 되었습니다

즉 약 11%에 차이를 보이고 있습니다

 

디스크 공간

% localappdata% 에 설치된 폴더 용량으로 측정해 보았습니다

Electron

 

Tauri

일렉트론이 241MB, 타우리가 약 13MB 공간을 차지하고 있으며 약 95%에 차이를 보이고 있습니다

 

 

이러한 차이를 보이는 이유는 다음과 같습니다

1. 경량화된 구조 : Tauri는 Rust 기반으로 동작을 하며 이는 가능한 한 최소한의 자원을 사용하여 높은 성능을 제공합니다 그러나 Electron은 Chrominu과 Nodejs를 기반으로 동작하기 때문에 상대적으로 더 많은 시스템 자원을 사용합니다
2. 시스템 웹뷰 사용 : Tauri는 각 플랫폼의 네이티브 웹뷰를 사용하여 웹 콘텐츠를 렌더링 합니다 이는 브라우저 엔진을 프레임워크에 포함할 필요가 없기 때문에 앱의 크기를 줄일 수 있습니다 반면 Electron은 자체 내장된 Chrominum 인스턴스를 사용하기 때문에 크기와 메모리 사용량을 증가시킵니다
3. 빌드 최적화 : Tauri는 빌드 과정에서 Rust의 컴파일러와의 효율적인 의존성 관리를 통해 최적화를 하고 또한 렌더러 프로세스 같은 경우는 Vite 번들러를 기본으로 사용하기 때문에 빌드 시간을 단축시킬 수 있습니다

따라서 아래와 같이 정리할 수 있습니다

기준	Tauri	Electron
성능	Rust 로 구현되어있어 더 높은 성능 과 자원 사용이 최적화 되어있습니다	Chrominum 과 Nodejs 기반으로 하므로 더 많은 시스템 자원을 소비해 상대적으로 낮은 성능을 가지고있습니다
메모리 사용량	시스템 네이티브 웹뷰를 사용해 낮은 메모리 사용량	내장된 Chrominum인스턴스 때문에 추가 메모리가 필요해 높은 메모리 사용량
디스크 공간	앱의 크기가 훨씬 작아서 적은 디스크 공간이 필요	앱의 크기가 커져 더 많은 디스크 공간이 필요
보안	최소 권한 원칙을 따라 보안이 강화됨	Nodejs 환경으로 인해 추가적인 보안 고려사항이 있음
개발언어	Rust 와 웹기술(HTML,CSS,JS) 사용	자바스크립트 기반으로 프론트엔드 와 백엔드 모두에서 웹 기반 기술 사용
플랫폼 지원	윈도우,맥,리눅스 지원, 네이티브 통합 기능이 운영체제에 따라 다를수 있음	윈도우,맥,리눅스 등 넓은 범위 지원, 일관된 API를 통해 다양한 운영체제 에서 동일한 경험을 제공
생태계 및 지원	새로운 프레임워크 이기때문에 커뮤니티가 상대적으로 작음	수년간 구축된 방대한 생태계 및 커뮤니티 지원, 수많은 프레임 워크 와 라이브러리가 존재
개발 속도	Rust 언어를 배워야 되기때문에 학습곡선을 고려해야한다	자바스크립트에 익숙하다면 빠른 개발속도 제공

 

 

즉 Tauri는 성능과 보안사항 Electron보다 좋지만 Rust언어 기반이기 때문에 학습곡선을 고려해야 합니다 Electron는 개발 속도와 방대한 커뮤니티로 다양한 프로젝트를 할 수 있지만 Tauri에 비해 성능과 보안이 좋지는 않습니다

 

마치며

확실히 Tauri가 일렉트론 보다 성능이 좋은 건 맞는 거 같습니다 다만 Rust언어를 배워야 한다는 게 저한테는 큰 단점으로 다가오는 거 같습니다 지금은 일렉트론을 주로 사용하겠지만 또.. 트렌드가 바뀌면 Tauri가 많이 바뀔 수도 있으니 상황에 맞게 적절하게 판단하면 좋을 거 같습니다