Documentation

• https://developer.mozilla.org/en-US/docs/WebAssembly
  • "Compiling from C/C++ to WebAssembly"

Tools

• Online "GCC and MSVC C++ Demangler" I couldn't get the Emscripten -s DEMANGLE_SUPPORT=1 flag to work, so with some copy & pasting this site was helpful.

Projects

• https://github.com/shamadee/web-dsp

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

  • "Qt for WebAssembly update"

  • "[QTBUG-63917] Add support for WebAssembly as target platform for Qt - Qt Bug Tracker"

6 February 2018¶

• See here for a proof-of-concept of porting a library to WebAssembly: https://github.com/Omniblox/libfive/tree/add-web-assembly-support

  (Particularly https://github.com/Omniblox/libfive/blob/add-web-assembly-support/CMakeLists.txt for a CMake configuration for WebAssembly example.)

  Demo: https://omniblox.github.io/libfive/

24 January 2020¶

• Embedded non-web WASM notes

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

  Related links:

  • https://github.com/WebAssembly/wasm-c-api -- "Wasm C API prototype"

  • https://wasmtime.dev/ & https://github.com/bytecodealliance/wasmtime -- "Standalone JIT-style runtime for WebAssembly"

• 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