WebAssembly가 제공하는 새로운 개발자용 기능

WebAssembly 덕분에 이제 웹에서 사용할 수 있는 도구의 쇼케이스입니다.

Thomas Nattestad
Thomas Nattestad

WebAssembly를 통해 개발자는 다른 언어에서도 뛰어난 성능의 새로운 기능을 웹에 가져올 수 있습니다. 지난 몇 년 동안 개발자들은 그 가능성을 최대한 활용했습니다. 이 게시물에서는 WebAssembly 덕분에 유용한 새 도구 중 몇 가지만 소개하고자 합니다.

서두르지 말고 본론으로 바로 들어가겠습니다. :D

SQLite

이 완전한 SQLite 포트를 사용하면 경량의 임베디드 관계형 데이터베이스 관리 시스템을 손쉽게 사용할 수 있습니다. 자세한 내용은 이 멋진 포트와 사용 방법을 보여주는 블로그 게시물을 참고하세요.

FFmpeg.wasm

FFmpeg는 동영상, 오디오, 기타 멀티미디어 파일과 스트림을 처리하기 위한 일련의 라이브러리와 프로그램으로 구성된 무료 오픈소스 소프트웨어 프로젝트입니다. 이 모든 기능을 브라우저에서 직접 수행할 수 있는 Wasm 컴파일 버전 (github 저장소)에서 찾을 수 있습니다.

범용 장면 설명 (USD)

USD (Universal Scene Description)는 공동작업, 비파괴적인 편집, 그래픽 데이터에 관한 다양한 뷰와 의견을 지원하는 데 초점을 맞춘 3D 컴퓨터 그래픽 데이터용 프레임워크입니다. 이는 Pixar, Autodesk, Nvidia 등 다양한 제품에서 지원되는 업계 표준입니다. 웹 지원은 아직 초기 단계이지만 Autodesk에서 이미 웹 기반 USD 뷰어를 오픈소스로 제공하고 있으며 여기에서 확인할 수 있습니다.

CanvasKit

CanvasKit는 WebAssembly에 직접 컴파일되는 Chrome 및 Android의 렌더링 엔진인 Skia입니다. 이를 통해 Skia 렌더링 엔진의 거의 모든 기능에 액세스할 수 있는 간단한 JavaScript API에 액세스할 수 있습니다. 이 기능에는 복잡한 렌더링, 텍스트 도형, 애니메이션, 잉크 등이 포함됩니다. npm 패키지빠른 시작 가이드를 확인하세요.

TensorFlow.js

TensorFlow.js는 간단한 JavaScript API를 사용하여 브라우저에서 직접 TensorFlow의 강력한 기능을 이용할 수 있습니다. 내부적으로 GPU와 CPU 전반에 걸쳐 모델을 최적화 (SIMD 최적화 포함)하여 성능을 극대화합니다. 시작 가이드를 확인하거나 몇 가지 데모를 직접 볼 수 있습니다.

OpenCV

OpenCV는 주로 실시간 컴퓨터 비전을 위한 프로그래밍 기능의 업계 표준입니다. 여기에서 사용하기 쉬운 npm 패키지가 제공되며, Emscripten 사용자의 경우 전체 빌드를 실행하기 위한 자세한 안내도 확인할 수 있습니다. SIMD 및 스레드가 이러한 워크로드의 성능을 어떻게 개선하고 있는지 알아보려면 Modern WebAssembly Chrome Dev Summit 강연의 이 섹션을 시청하세요.

코코스

Cocos는 개발자가 크로스 플랫폼을 지원하는 게임을 빌드할 수 있도록 지원하는 강력하고 인기 있는 게임 엔진으로, 이제 웹도 여기에 포함됩니다. Wasm을 통한 웹 내보내기를 지원하는 긴 게임 엔진 목록에 포함됩니다. 시작하려면 Cocos 편집기로 이동하여 이 안내를 따르세요.

결론

이러한 구체적인 예 외에도 새로운 웹 기능의 속도를 변화시킬 수 있는 WebAssembly의 잠재력에 대한 관심이 많습니다. Chrome에서는 모든 개발자가 사용할 수 있는 웹 기능을 발전시키는 데 필요한 자금을 마련할 수 있도록 Advanced Web Apps Fund를 설립했습니다.

Ann Marie KennonPexels 히어로 이미지