WebAssembly As a High-Performance UI Engine

web assembly

WebAssembly was first released in 2017. Technically speaking it is a binary instruction format for a stack-based virtual machine. WebAssembly software provides a portable C++ compile target (called Wasm, for short) that has several advantages over it’s predecessor, asm.js:

  • High-level bytecode format, which eliminates the need to parse script text and precompile it for optimization. The bytecode can be run via directly translating to native instructions. Startup times of Wasm apps to load and begin execution of the code are orders of magnitude faster compared to asm.js.
  • The bytecode format is a more compact way to deliver code, hence less network download.
  • Wasm implements its own instruction set and is not constrained by the JavaScript language.

Any code that compiles to asm.js can be compiled to WebAssembly either. A simple change in a compiler flag will generate a file with the .wasm extension. The file is small, and only 116 bytes in length. Although the file contains bytecode, a standardized text representation of the code exists named the WebAssembly text format. This is the text representation of sample code:

(module
  (type $t0 (func (param i32 i32) (result i32)))
  (import "env" "memory" (memory $env.memory 256 256))
  (func $a (type $t0) (param $p0 i32) (param $p1 i32) (result i32)
    (local $l0 i32) (local $l1 i32) (local $l2 i32) (local $l3 i32)
    get_local $p0
    set_local $l0
    loop $L0
      get_local $l0
      i32.load8_s
      tee_local $l2
      i32.eqz
      set_local $l1
      get_local $l0
      i32.const 1
      i32.add
      set_local $l3
      get_local $l1
      i32.const 1
      i32.xor
      get_local $p1
      i32.const 24
      i32.shl
      i32.const 24
      i32.shr_s
      get_local $l2
      i32.ne
      i32.and
      if $I1
        get_local $l3
        set_local $l0
        br $L0
      end
    end
    i32.const -1
    get_local $l0
    get_local $p0
    i32.sub
    get_local $l1
    select)

The code has been optimized for size, so the function name was renamed to a.

IQ Direct uses WebAssembly for delivering high-performance applications for our customers.

WebAssembly is now in a stable 1.x release and supported by all major browsers (Chrome, Mozilla, Edge), including mobile versions (iOS and Android). Several languages have adopted Wasm as a valid compilation target. You can build WebAssembly programs using C, C++, TypeScript, Go, Rust, and dozens of other programming languages. It has been implemented in solutions for computer vision, audio mixing, video codec support, digital signal processing, medical imaging, physical simulations, encryption, compression, and even more.