Nocturnal Pumpkin Maelstrom

    inline-webassembly
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.7 • Public • Published

    inline-webassembly

    Easiest way to write WebAssembly

    npm version

    Installation

    $ npm install --save inline-webassembly

    Usage

    const iw = require('inline-webassembly');
    // or
    import * as iw from 'inline-webassembly';

    Loading in browser

    Assuming that your JS file is named main.js

    $ npm i -g browserify
    $ browserify main.js -o bundle.js

    then

    <script src="bundle.js"></script>

    Syntax highlight (VS Code)

    To have WebAssembly syntax highlighting in VS Code, use extension: Inline WebAssembly Syntax Highlight

    API

    WasmModule

    The constructor is going to return an instance of WasmModule which is an extension of the original WasmModule returned by the underlying wabt package.

    Additional helper methods:

    readString(index: number, length?: number): string Returns a string, provided an index, which should be a pointer in the module memory.

    createString(string: string, memoryLocation?: number): number Creates a string in the module memory and returns a pointer to it.

    Getting started

    Add two numbers

    const iw = require('inline-webassembly');
    
    iw(`
      (module
        (func (export "add") (param $n1 i32) (param $n2 i32) (result i32)
          get_local $n1
          get_local $n2
          i32.add))`
    ).then((wasmModule) => {
      const sum = wasmModule.add(44, 99);
      console.log(`Sum = ${sum}`); // 143
    });

    Other examples

    Read a string from memory

    const iw = require('inline-webassembly');
    
    iw(`
      (module
        (memory (export "memory") 1)
        (func (export "hello") (result i32)
          i32.const 16
        )
        (data (i32.const 16)
          "Hello World"
        )
      )`
    ).then((wasmModule) => {
      const stringPointer = wasmModule.hello(44, 99);
      const string = wasmModule.readString(stringPointer)
      console.log(`Result = ${string}`); // Hello World
    });

    Call a JS function from WebAssembly

    const iw = require('inline-webassembly');
    
    const sayHey = function() {
      console.log('Hey!')
    }
    
    iw(`
      (module
        (import "env" "sayHey" (func $sayHey))
        (func (export "hello")
          (call $sayHey)
        )
      )`, { env: { sayHey }}
    ).then((wasmModule) => {
      wasmModule.hello(); // Hey!
    });

    Reverse a string

    const iw = require('inline-webassembly');
    
    iw(`
      (module
        (memory $0 1)
        (export "memory" (memory $0))
        ;; declaring and exporting a function named "reverse"
        ;; it takes two arguments, the pointer to a string and its length
        ;; and it returns a 32 bit integer which is going to be the pointer
        ;; to the reversed string
        (func (export "reverse") (param $sref i32) (param $slen i32) (result i32)
    
          ;; declaring new variable to store result pointer
          (local $result i32)
    
          ;; seclaring iterator variable
          (local $iterator i32)
    
          ;; write pointer
          (local $write_to i32)
    
          ;; setting $result = $sref + $slen + 1
          (set_local $result
            ;; adding 1
            (i32.add
              ;; adding the string pointer with its length
              (i32.add
                (get_local $sref)
                (get_local $slen)
              )
              (i32.const 1)
            )
          )
          
          ;; setting iterator to 0, for the following loop
          (set_local $iterator
            (i32.const 0)  
          )
    
          ;; we'll start writing to the start of the result
          (set_local $write_to
            (get_local $result)  
          )
            
          (block
            (loop
              
              ;; store one character from original string to resulting string
              (i32.store
                (get_local $write_to)
                ;; load 1 byte and sign-extend i8 to i32
                (i32.load8_s
                  (i32.sub
                    (i32.sub
                      (i32.add
                        (get_local $sref)
                        (get_local $slen)
                      )
                      (get_local $iterator)
                    )
                    (i32.const 1)
                  )
                )  
              )
    
              ;; increment position to write to on next loop iteration
              (set_local $write_to
                (i32.add
                  (get_local $write_to)
                  (i32.const 1)  
                )  
              )
    
              ;; increment iterator by 1 for every loop iteration
              (set_local $iterator
                (i32.add
                  (get_local $iterator)
                  (i32.const 1)  
                )  
              )
              
              ;; break loop if iterator reaches string length
              (br_if 1
                (i32.ge_s
                  (get_local $iterator)
                  (get_local $slen)
                )
              )
              
              ;; repeat loop
              (br 0)
            )
          )
    
          ;; returning result which contains pointer to the reversed string
          (get_local $result)
        )
      )`
    ).then((wasmModule) => {
      const stringToReverse = wasmModule.createString('Dorin');
      const resultPointer = wasmModule.reverse(stringToReverse, 5);
      const resultString = wasmModule.readString(resultPointer);
      console.log(`Result = ${resultString}`);
    });

    Keywords

    none

    Install

    npm i inline-webassembly

    DownloadsWeekly Downloads

    1

    Version

    1.0.7

    License

    MIT

    Unpacked Size

    147 kB

    Total Files

    8

    Last publish

    Collaborators

    • dorin131