Transcript
00:00:00Wails는 Go 언어로 데스크톱 수준의 앱을 제작할 수 있게 해주는 크로스 플랫폼 기술입니다.
00:00:04여러 데스크톱 프레임워크 비교 영상을 진행한 후, 채널에서 정말 많은 요청을 받은 주제인데요.
00:00:08그래서 오늘은 Wails를 사용해 데스크톱 수준의 앱을 만드는 방법을 살펴보고,
00:00:13Electron 및 Tauri 같은 프레임워크와 비교해 보겠습니다. 다른 영상에서도 다뤘던
00:00:17데스크톱 비디오 녹화 프로그램을 만들며 파일 크기,
00:00:22성능, 개발자 경험 등을 비교해보겠습니다. 사실 Wails는 저에게 완전히 새로워서
00:00:27이번 영상에서 여러분과 함께 배워나갈 예정입니다. Wails는 Tauri와 매우 유사한 방식으로 작동하지만,
00:00:36백엔드가 Rust가 아닌 Go로 작성됩니다. 프론트엔드는 여전히 웹 기술을 사용해 웹뷰로 구현하고
00:00:41Golang이 관리하는 네이티브 API를 호출하죠. 덕분에 Mac과 Windows 모두와
00:00:47호환되는 애플리케이션을 컴파일할 수 있습니다. 하지만 Electron과 달리 Wails는 브라우저를 내장하지 않습니다.
00:00:52대신 Tauri처럼 각 플랫폼의 네이티브 렌더링 엔진을 재사용합니다. 따라서 번들 크기가
00:00:58이론적으로는 훨씬 작아야 하는데, 잠시 후 비교할 때 직접 확인해 보시죠.
00:01:03이런 콘텐츠가 마음에 드신다면 구독 부탁드립니다. 이제 보여드릴 것은 Wails로 개발한
00:01:07화면 녹화 툴이며, Electron과 Tauri로도 똑같이 제작해 보았습니다.
00:01:12녹화할 화면을 선택하고 녹화 버튼을 누릅니다. 마우스를 움직일 수 있고, 실제
00:01:16데스크톱 앱 자체는 녹화 화면에 나타나지 않습니다. 정지 버튼을 누르면 방금 녹화한 화면이
00:01:21보이죠. 원한다면 잘라낼 수도 있고, MP4로 내보내기를 클릭해 영상을
00:01:27내 컴퓨터에 직접 저장할 수도 있습니다. 프로젝트 구조를 살펴보면 Electron에서
00:01:32보던 것과 매우 유사한 구성임을 알 수 있습니다. front-end 폴더에 모든 프론트엔드 파일이 들어 있고
00:01:36엔트리 파일이 존재하죠. 이 경우 main.go라는 Go 파일이고, 이 안에는
00:01:41main 함수가 있습니다. 마찬가지로 Electron과 비슷한 구조이며,
00:01:47제목, 너비와 높이 지정, 배경색 설정 등과 함께
00:01:52Mac 전용 옵션도 설정할 수 있습니다. Mac과 Windows 간 차별화를 두고 싶다면 완벽히
00:01:57구현할 수 있죠. 이제 front-end 안의 src 폴더를 열어보면 모든
00:02:02React 코드가 보입니다. app.tsx를 살펴보면, Go 쪽에서 정의된 API를
00:02:09호출하는 것 외에는 전형적인 표준 React 코드입니다. 여기서 import한 API의 사용처를
00:02:16파일 전체에서 찾아보면, API.onrecording finished, onrecording failed, start recording 등을 사용하고 있고, 이 API는
00:02:22Wails에 의해 자동으로 생성됩니다. API 파일 내부를 들여다보면 핵심
00:02:27함수들이 wails.js/go/main/app 파일에서 오고 있음을 알 수 있습니다. 이 안을
00:02:33열어보면 자동으로 생성된 파일이라는 것을 알 수 있으며, 상단에는 웰시어(웨일스어)와 영어 주석이
00:02:39있는데, 놀랍게도 Wails의 제작자가 웨일스 출신이기 때문입니다. 여기에
00:02:43export video, list sources, request screen access 등 화면 녹화 툴에 필요한
00:02:49모든 함수가 정의되어 있죠. 그럼 Go 코드 측인 app.go로 넘어가서
00:02:54list sources 부분을 주석 처리하고 저장해보겠습니다. 그러면 갑자기 API.ts에서 에러가 발생하는데,
00:02:59더 이상 list sources가 존재하지 않기 때문입니다. 이는 우리가 wails dev를 실행 중이기 때문인데요.
00:03:05Go 파일 내부에서 변경사항이 생길 때마다 TypeScript 타입을 자동으로 다시 생성해줍니다. 다시 돌아가서
00:03:11주석을 해제하면 에러가 사라지고 데스크톱 앱이 실제로 새로고침됩니다.
00:03:16Go 측, 즉 백엔드의 모든 변경사항이 애플리케이션을 자동으로 재컴파일하고 다시 렌더링하기
00:03:23때문입니다. 이제 세 프레임워크 간의 차이점을 확인하기 위해 비교를 진행해봅시다.
00:03:27먼저 번들 크기입니다. Wails는 52메가바이트, Tauri는 57메가바이트, Electron은
00:03:34놀랍지도 않게 324메가바이트입니다. Wails와 Tauri가 확연히 작게 나타나는데, 이는
00:03:41Chromium을 번들에 포함하지 않기 때문이며 이는 지극히 당연한 결과입니다. 하지만 Wails와 Tauri처럼
00:03:47각 플랫폼의 네이티브 웹뷰를 사용하면 플랫폼 간 호환성 차이가 발생할 가능성이 더 높습니다.
00:03:51요즘은 크게 문제되지 않는 부분이지만 염두에 둘 필요는 있습니다. 기본적으로 Tauri와
00:03:57Wails는 번들 크기 측면에서 비슷한 산출물을 만들어냅니다. 내부적으로는 완전히 다른
00:04:02기술을 사용함에도 불구하고 두 프레임워크의 구조적 설계가 거의 동일하기 때문이죠.
00:04:07이제 시작 시간을 다뤄보겠습니다. 이전 데스크톱 앱 비교 영상들과 마찬가지로
00:04:12각 앱을 10번씩 실행한 뒤 평균값을 구했습니다. Wails는 395
00:04:18밀리초, Tauri는 410밀리초, Electron은 350밀리초가 나왔습니다. 매번 캐시를
00:04:26초기화하는 콜드 스타트의 경우 Wails가 2,337밀리초, Tauri가 2,049밀리초, Electron이 1,890밀리초로
00:04:34실제로는 약간 더 빨랐습니다. 런타임 성능을 살펴보면, Tauri와 마찬가지로 화면을 녹화할 때의
00:04:40런타임 성능이 Electron보다 훨씬 뛰어납니다. 이는 Mac의 네이티브 CaptureKit을
00:04:45사용하도록 설정했기 때문인데요, 데이터가 브리지를 거치지 않기 때문이죠. 반면 Electron은
00:04:51웹뷰 자체에서 녹화한 뒤 데이터를 백엔드로 전달하므로 약간의 오버헤드가 발생합니다.
00:04:56Electron에서도 커스텀 C 코드를 작성한다면 네이티브 CaptureKit을 사용할 수도 있겠지만,
00:05:02이는 Electron의 기본 방식이 아니므로 오늘 비교에서는 기본 구현 기준을 적용했습니다.
00:05:06이제 개발자 경험을 살펴볼 텐데, 가장 큰 차이를 체감할 수 있는 부분입니다.
00:05:11개인적으로 Wails를 사용해 개발하는 과정이 꽤 즐거웠지만, 화면 캡처 기능을
00:05:15구현하는 과정은 Tauri만큼 쉽지 않았습니다. CaptureKit에 접근하기 위해 Objective-C 코드를 직접 써야 했던 반면,
00:05:21Tauri에서는 순수 Rust 안에서만 처리할 수 있었죠. Rust에는 Apple의 네이티브 프레임워크를 래핑한
00:05:28거대한 커뮤니티 Crate 생태계가 구축되어 있기 때문입니다. Tauri에서는 screen_capture_kit이라는 Crate를
00:05:33가져오기만 하면 전체 녹화 API를 일반적인 Rust 코드로 다룰 수 있었습니다. 반면 Go에는 ScreenCaptureKit을 지원하는 괜찮은 라이브러리를 찾지 못했지만,
00:05:39C 코드를 컴파일하기 위해 Go에 내장된 기능인 Cgo가 존재합니다.
00:05:44즉, Go에서는 .m 파일에 네이티브 C 코드를 작성해 일반 C 함수로 노출한 뒤,
00:05:50Apple의 어느 프레임워크와 링킹할지 Go에게 알려주면 됩니다. 결과적으로 Rust Crate와 마찬가지로
00:05:56동일한 Apple API를 호출하는 실제 Objective-C 코드를 직접 작성하게 되지만, 모든 코드의 소유권을 직접 갖게 됩니다.
00:06:02결국 Rust 앱에는 없었던 약 450줄의 Objective-C 코드를 작성해야 했습니다. 그래서 전반적으로는
00:06:08Tauri 쪽으로 조금 더 기울게 되네요. 제가 경험해본 바로는 Rust Crate 생태계가
00:06:14더 뛰어났지만, 결국 취향 차이라고 봅니다. Go 기반 개발을 선호하신다면 Wails는 정말
00:06:18훌륭한 선택지이고, Rust가 좋다면 Tauri를 선택하시면 됩니다. 다만 Wails를 선택할 경우
00:06:24생태계가 아직 완전히 자리 잡지 않아 네이티브 코드를 직접 작성해야 할 수도 있습니다. 이번 영상이
00:06:29유익하셨기를 바라며, 이런 유형의 콘텐츠를 더 보고 싶다면 구독해 주세요. Deno Desktop과
00:06:33Electrobun을 비교했던 영상처럼 데스크톱 프레임워크 비교 영상을 더 보고 싶으시다면,
00:06:39바로 여기에 시청하실 수 있는 영상 링크를 첨부해 두었습니다. 시청해 주셔서 정말 감사합니다. Better Stack의 Warren이었으며,
00:06:43다음 영상에서 인사드리겠습니다. 아 참, 마일로가 이번 주에는 더 이상 영상을 찍지 말라고 하네요.
00:06:49월요일에 뵙겠습니다.
00:06:50*음악*