며칠전 꿀휴가동안 무언가 두리번거리다가, 스위프트 언어로 Web Assemby를 만들어서 웹에서 실행하는 프로젝트를 구경했다. 이 글은 그 낯선 두리번 거림을 짧게나마 공유하는 글이다.
시작은 스위프트 공식 포럼에 SwiftWasm 프로젝트에 대한 글을 보게 된 것이다. 10년전쯤 개발자 커뮤니티에 LLVM 이야기를 하면, 구글의 NaCL 이나 Wasm 이야기가 그저그런 뒷얘기 중에 하나였다. 왜냐하면 LLVM 개발자 밋업에서 LLVM 활용한 사례로 공유되기는 하지만 실제로 활성화되지 못했기 때문이다.
NaCl은 크롬OS가 나오면서 사라진거 같고, 그래도 Wasm은 표준으로 자리 잡으면서 Doom을 올리거나 빠른 연산 엔진을 올리는 경우도 종종 볼 수 있었다. Wasm 내부 이야기는 여기서는 논외로 하자 (스택기반 바이트 코드로 동작하는 어셈블리 JIT 엔진같은 느낌이지만 솔직히 잘 몰라서 스킵🙃)
Wasm을 만드는 여러 도구들 중에서 Swift-Wasm 프로젝트가 다시 관심 받는 것은 SwiftUI로 뷰를 선언하고 그것은 웹브라우저 DOM 객체와 연결하는 작업을 했기 때문이다. 공식 프로젝트 사이트는 https://swiftwasm.org 이다.
그리고 관련 프로젝트 저장소는 https://github.com/swiftwasm 아래 모여있다
그 중에서 몇 가지만 소개를 해보자.
- swiftwasm/swift 저장소는 스위프트 언어에 Wasm을 지원하기 위한 프론트엔드 기능들을 주로 넣고 있는 것으로 보인다
- swiftwasm/JavaScriptKit 저장소는 자바스크립트 객체들과 브릿지를 도와주는 라이브러리다. JavaScriptEvent와 함께 꼭 필수 프레임워크다
- swiftwasm/DOMKit 저장소는 DOM 객체와 연결을 도와줘서 뷰 요소를 웹에 표시하도록 도와준다
- swiftwasm/carton 저장소는 카톤인줄 알았는 불어로 카르통(?) 박스 같은 표현이라고 한다. wasm 앱 프로젝트를 만들 수 있도록 패키지, 번들 구조를 지원한다. 맨 위에 swift 제외하고는 대부분 스위프트로 작성된 프로젝트들이다.
- 마지막으로 예제와 관련 자료를 모아놓은 swiftwasm/awsome-swiftwasm 저장소가 있다. 몇 개 실행해봤는데, 어떤 느낌인지 궁금하다면 https://github.com/swiftwasm/swift-web-github-example 를 실행해보면 된다.
swiftwasm 프로젝트를 다루려면 swiftwasm/swift에서 배포하는 SNAPSHOT 툴체인이 필요하다. 얼마전에 Swift 5.5를 지원하는 스냅샷이 올라왔다.
스냅샷을 무작정 받기 보다는 시작하기 전에 공식 튜토리얼 도움말을 읽어보길 추천한다
위 자료를 따라하다보면 carton 명령을 brew로 설치하라고 하는데 이거 생각보다 편하다. carton 구현 부분을 살펴보니 vapor를 내장하고 있어서 실행하면 로컬 서버를 띄워서 직접 확인할 수 있도록 도와준다.
빌드 환경을 설정하고 나면 원하는 함수들만 .wasm 을 빌드해서 웹 브라우저에서 지원하는 자바스크립트로 로딩을 할 수 있는데 아직 원하는 수준으로 깔끔하게는 못해봤다.
carton을 써서 vapor로 실행하거나 Webpack 설정을 포함하는 템플릿으로 시작해서 node + npm으로 빌드하고 실행하는 방법 뿐이었다. 후자를 잘하려면 스위프트보다 자바스크립트를 더 잘 알아야 하더라.
SwiftUI로 만든 프로젝트는 web github example 저장소를 살펴보면 된다.
이 예제도 모든 코드는 스위프트로 되어 있다. GitHub API에 요청해서 가져온 JSON 데이터를 뿌려주는 코드다. 웹은 JavaScriptKit으로 fetch() 하고, iOS는 URLSession을 사용한다. 저장소 목록에 항목을 보여줄 때도 GitHubView를 각각 웹과 SwiftUI로 처리한다. 같은 프로젝트를 웹에서도 쓰고, 앱에서도 쓰는 정도는 아니다. 각 플랫폼에 맞는 구조를 갖고 있고, 동일하게 보이도록 둘 다 스위프트로 구현했다는 게 더 정확하다
결론적으로 Swift-Wasm 프로젝트는 흥미로웠다. 특히 carton 프로젝트에 vapor가 내장되어 있어서 간단한 웹 페이지를 스위프트로 만들 수 있다. JS 객체를 브릿지하는 게 많아서 자연스럽지는 않았다. 다만 아쉽게도 Xcode 프로젝트로는 안되고, SPM 기반으로 터미널 상에서 빌드해야만 했다.
마지막으로 SwiftUI 요소를 DOM과 연결해서 보여주려는 시도도 매우 흥미롭다. 웹뷰로 앱을 만들려는 시도와 반대로 스위프트 코드로 웹 요소를 구현한다는 게 특이 묘한 기분이었다.
