WebAssembly for server-side development. Is it worth it in 2024?

WASM & WASI?

서버 개발을 위한 웹 어셈블리 생태계에 관해 알아보는것이 핵심 주제인 만큼 간략히 개념만을 짚고 넘어가려 한다.

WebAssembly (WASM)

웹 브라우저는 HTML과 CSS만으로 수행이 불가능한 API 호출 등의 동적인 행위를 위해 Javascript를 사용한다. 브라우저는 내부적으로 Javascript 엔진을 가지고 코드를 실행하는데 WebAssembly는 코드 파싱, 바이트코드 생성 등의 단계를 최소화해 실행 속도를 향상시킨다. 이를 통해 많은 계산량이 요구되는 그래픽 렌더링, 암호화 등을 브라우저의 샌드박스 내에서 실행할 수 있도록 해준다.

graph LR
    A[JavaScript 코드] --> B[파싱 & AST 생성]
    B --> C[바이트코드 생성 & 실행]
    C --> D[최적화 & JIT 컴파일]
    D --> E[기계어 코드 실행]

    style A fill:#f9f,stroke:#333,stroke-width:2px
    style E fill:#bbf,stroke:#333,stroke-width:2px

graph LR
    A[WebAssembly 모듈] --> B[로딩 & 컴파일]
    B --> C[인스턴스화]
    C --> D[기계어 코드 실행]

    style A fill:#f9f,stroke:#333,stroke-width:2px
    style D fill:#bbf,stroke:#333,stroke-width:2px

상단의 다이어그램은 Javascript의 실행 과정이며 하단은 WebAssembly의 실행 과정이다.

WebAssembly System Interface (WASI)

처음 Javascript의 개발 목적은 동적인 웹 페이지의 제공이었다. 그렇기에 기본적으로는 브라우저라는 샌드박스 내에서 벗어나지 못하며 시스템의 파일, 네트워킹 등에 대한 접근이 제한된다. 하지만 현재는 Node.js와 같이 브라우저 외부에서 개별적으로 동작하는 Javascript 엔진이 존재한다. 이런 엔진들은 운영체제와 상호작용할 수 있는 기능들을 제공하여 Javascript를 통해 서버 사이드 앱을 개발하는것이 가능해졌다.

WebAssembly 또한 웹 클라이언트를 위해 등장하였다. 이후 Node.js와 비슷하게 운영체제에 접근하기 위한 규격이 등장하였는데 그것이 WebAssembly System Interface, WASI이다. 다만 이는 Node.js처럼 실제로 동작하는 엔진이 아니라 약속이다. 실제로 이를 지원하며 실행되는 엔진은 WASI 런타임이며 Wasmtime, Wasmedge, Wasmer 등 여러 런타임들이 개발중이지만 아직 WASI의 모든 규격을 지원하는 런타임은 없다.

graph TD
    V8[V8 JavaScript Engine]
    Node[Node.js]
    WASM[WebAssembly]
    WASI[WebAssembly System Interface]

    V8 --> Node
    WASM --> WASI

    style V8 fill:#f9d71c,stroke:#333,stroke-width:2px
    style Node fill:#68a063,stroke:#333,stroke-width:2px
    style WASM fill:#654ff0,stroke:#333,stroke-width:2px
    style WASI fill:#00b9f1,stroke:#333,stroke-width:2px