Notes: WebAssembly by follower

Notes from working with WebAssembly / Emscripten / wasm / etc

Documentation

Tools

Projects

18 January 2018

  • The default .html page ends up with a FS object (see File System API — Emscripten documentation) for interacting with the in-memory filesystem which is automatically created.

    From the console you can do this to check the existence of the file system root:

        FS.stat("/")

    And check for the existence of particular files like this:

        FS.stat("/example.bin")

    You can extract the content of a file like this:

        file_content = FS.readFile("/example.bin")

    Clearly interacting with the "filesystem" isn't an ideal for passing data from your compiled WASM code but as a first step to porting it's quite handy.

  • In order to download (to your local computer) a copy of a file that has been created inside the WebAssembly in-memory file system this approach works (from within the console, for a binary file, at least):

        function download(filename, the_file_content, mime_type) {
      //
      // Based on: <https://ourcodeworld.com/articles/read/189/how-to-create-a-file-and-generate-a-download-with-javascript-in-the-browser-without-a-server>
      //
      // With modifications via: <https://stackoverflow.com/questions/44913341/octet-stream-data-uri-ignoring-a-download-attribute#44913497>
      //

      var element = document.createElement('a');
      element.setAttribute('href',
                           URL.createObjectURL(new Blob([the_file_content],
                                              {type: mime_type})));
      element.setAttribute('download', filename);

      element.style.display = 'none';
      document.body.appendChild(element);

      element.click();

      document.body.removeChild(element);
    }

    file_content = FS.readFile("/example.bin")

    download("example.bin", file_content, 'application/octet-stream')

    The second link also makes reference to download.js which I suspect is likely to be a more robust approach than this quick snippet. :)

  • In case you were interested in Qt for WebAssembly, apparently that might be an option: :D

6 February 2018

24 January 2020

  • Embedded non-web WASM notes

  • Specifically looking at embedding within a C/C++ application.

    Related links:

  • wasmtime and its docs seem primarily focused on Rust (and using WASI system interface which may be useful in future but that adds more complexity than what I want to start with) rather than C/C++ but the releases do appear to have library binaries for C/C++ use.

25 January 2020

  • Notes from creating a very simple .wat (WebAssembly Text) example:

        (module
      (func (export "f") (result i32) (i32.const 4))
    )

    Cobbled together from less simple examples from: WebAssembly/wasm-c-api/example

    Using tools from wabt the .wat file can be compiled to byte code & then interpreted:

        $ wat2wasm -v simple.wat -o simple.wasm
    [...snip byte code dump...]

    $ wasm-interp --run-all-exports simple.wasm 
    f() => i32:4

    The -v gives you dump of generated byte code & meaning, e.g.:

        [...snip...]
    ; section "Code" (10)
    000001a: 0a                                        ; section code
    000001b: 00                                        ; section size (guess)
    000001c: 01                                        ; num functions
    ; function body 0
    000001d: 00                                        ; func body size (guess)
    000001e: 00                                        ; local decl count
    000001f: 41                                        ; i32.const
    0000020: 04                                        ; i32 literal
    0000021: 0b                                        ; end
    000001d: 04                                        ; FIXUP func body size
    000001b: 06                                        ; FIXUP section size

    I used the binaries in wabt-1.0.13-linux.tar.gz from https://github.com/WebAssembly/wabt/releases/tag/1.0.13.

  • For more details on the WebAssembly Text format see: https://developer.mozilla.org/en-US/docs/WebAssembly/Understanding_the_text_format#Adding_functionality_to_your_module

28 January 2020

  • Progress:

        ./wasm-c-test-one 
    [start]
    [init]
      0x5626bcd6a720
      0x5626bcd6a740
    [read bytecode]
      34
      0x5626bcd6ab30
      00  61  73  6d  01  00  00  00  01  05  01  60  00  01  7f  03  02  01  00  07  05  01  01  66  00  00  0a  06  01  04  00  41  04  0b
    [validate module]
      valid
    [compile module]
      0x5626bcd6b030
    [instantiate]
      0x5626bcd6d700
    [extract exports]
      num found: 1
      kind: 0
      0x5626bcd6d1b0
      num params: 0
      num results: 1
    [calling]
      result: 4
    [cleanup]
    [end]

6 March 2020

15 March 2020