3D + 2D: 나의 크로스 플랫폼 WASM 그래픽 엔진 테스트하기
요약
Adobe 출신의 개발자가 WebAssembly(Wasm)를 기반으로 한 크로스 플랫폼 그래픽 프레임워크인 'Renderlet'을 개발하고 있습니다. 이 프레임워크는 고수준의 사용 편의성과 저수준의 GPU 성능을 동시에 제공하며, 어디에서나 내장 가능한 독립적인 그래픽 모듈 구현을 목표로 합니다.
핵심 포인트
- WebAssembly(Wasm)를 활용하여 데스크톱, 웹, 모바일 등 다양한 환경에서 실행 가능한 고성능 그래픽 스택 구축
- 독립적인 그래픽 모듈을 연결하여 상호 운용성을 극대화하는 'Renderlet' 개념 도입
- Unity가 게임 개발 방식을 혁신했듯, 모든 시각적 애플리케이션을 위한 범용 그래픽 프레임워크 지향
- 저수준 3D API를 노출하면서도 Rive와 같은 고수준 2D 벡터 엔진을 백엔드로 통합할 수 있는 유연성 제공
저는 Adobe에서 Photoshop 및 Acrobat과 같은 대규모 애플리케이션을 구동하는 인프라 부문에서 근무했습니다. 우리의 가장 큰 고민 중 하나는 이러한 강력한 코드베이스를 완전히 새로 작성하지 않고도 데스크톱, 웹, 모바일 및 클라우드에서 작동하도록 만드는 것이었습니다. 예를 들어, Lightroom과 Photoshop을 웹에서 작동시키기 위해 우리는 JavaScript, Google의 PNaCl, asm.js, 그리고 마침내 WebAssembly (Wasm)를 거치는 우회로를 택했으며, 그 과정에서 이러한 기기들에 맞게 GPU 아키텍처를 재고해야 했습니다. 심지어 싱글 스레드 (single-threaded) 빌드를 작동시켜야 했고, Web Components를 중심으로 UI를 다시 구축해야 했습니다. 오늘날 웹 빌드는 훌륭하게 작동하지만, 그곳에 도달하기까지는 10년이 걸린 여정이었습니다!
그래픽 스택은 이식성 (portability) 측면에서 계속해서 가장 큰 병목 현상 중 하나로 남아 있습니다. 그러던 어느 날, 저는 WebAssembly (Wasm)가 이 혼란에 대한 실제 해결책을 쥐고 있다는 것을 깨달았습니다. 이는 어디에서나 실행 가능하고, 무엇이든 내장(embeddable)할 수 있으며, 실시간 그래픽을 구현할 수 있을 만큼 충분히 성능이 뛰어납니다. 그래서 저는 직장을 그만두고, 처음부터 휴대 가능하고 내장 가능한 WASM 기반 그래픽 프레임워크를 만드는 모험에 뛰어들었습니다. 앱 개발자가 원하는 어떤 그래픽이든 쉽게 만들 수 있을 만큼 충분히 고수준 (high-level)이면서, 동시에 GPU와 고성능 애플리케이션에 필요한 모든 것을 최대한 활용할 수 있을 만큼 충분히 저수준 (low-level)인 프레임워크를 말입니다.
저는 내장 가능한 측면을 강조하기 위해 이를 Renderlet이라고 부릅니다. 여러분은 원하는 기능만을 수행하는 독립적인 그래픽 모듈을 만들고, 이들을 서로 연결하여 아주 사소한 상호 운용성 (interop)만으로 무엇 위에서든, 혹은 무엇 안에서든 실행되게 할 수 있습니다.
Unity가 개발자들이 크로스 플랫폼 게임을 쉽게 만들 수 있도록 했던 방식을 생각해보면, 제 아이디어는 모든 시각적 애플리케이션에 대해 동일한 일을 수행하는 것입니다.
진행 과정 중에 저는 1인 창업자(!)로서 YC(Y Combinator)에 합류하게 되었지만, 지난 6개월 동안은 주로 이 프로젝트를 만드는 데만 몰두해 왔습니다. 아직 오픈 알파 (Open Alpha) 출시를 할 만큼 완벽히 준비된 상태는 아니지만, 거의 다 되었습니다. 이에 대해 글을 쓰고, 결과물을 보여주고, 피드백을 받기 시작할 수 있을 만큼 충분히 근접했습니다. 이것은 애플리케이션 개발자로서 제가 꿈꿔왔던 것이며, 여러분이 어떻게 생각하시는지 알고 싶습니다!
몇 주 전 Rive가 자신들의 2D 벡터 엔진을 오픈 소스로 공개하며 HN(Hacker News)에서 큰 반향을 일으켰을 때 (https://news.ycombinator.com/item?id=39766893), 저는 흥미를 느꼈습니다. Rive의 렌더러 (Renderer)는 SVG와 유사한 고수준 (Higher-level) 2D API로 구축된 반면, Wander 렌더러 (Renderlet의 오픈 소스 런타임 부분)는 GPU 상에서 저수준 (Lower-level) 3D API를 노출합니다. Renderlet이 자신의 GPU 백엔드 (Backend)를 사용하여 Rive 렌더러 라이브러리를 실행함으로써, 모든 3D 애플리케이션이 2D 벡터 백엔드를 가질 수 있게 할 수 있을까요? 네, 가능합니다. 제가 직접 구현했습니다!
작동하는 모습은 여기에서 볼 수 있습니다: https://vimeo.com/929416955. 그리고 심도 있는 기술적 분석은 여기에서 확인하실 수 있습니다: https://github.com/renderlet/wander/wiki/Using-renderlet-wit.... 저의 런타임 Wasm 렌더러 (일명 Wander) 코드는 여기에 있습니다: https://github.com/renderlet/wander.
컴파일러를 누구나 사용할 수 있도록 준비하고 모든 플랫폼에서 통합 (Integration)이 작동하게 되면, 다시 돌아와 제대로 된 Show HN 또는 Launch HN을 진행하겠습니다. 하지만 지금 당장 살펴보기에 충분히 흥미로운 내용이기를 바랍니다. 이에 대해 여러분의 의견을 듣고 싶습니다!
AI 자동 생성 콘텐츠
본 콘텐츠는 HN Game Dev의 원문을 AI가 자동으로 요약·번역·분석한 것입니다. 원 저작권은 원저작자에게 있으며, 정확한 내용은 반드시 원문을 확인해 주세요.
원문 바로가기