Fix wasm toolkit and make it downloadable

[rettinghaus]

WebAssembly MEI viewer doesn't seem to be working (tried Safari, Chrome, Firefox). If it does, it would be nice to have a section for this on http://www.verovio.org/download.xhtml

[lpugin]

WebAssembly is only available in upcoming browser versions. E.g,. for Firefox you need Firefox Nightly (currently 53). Plus it needs to be enabled explicitly. So this is highly experimental and probably too early to have it on the download page.

[rettinghaus]

Firefox 52 already supports WebAssembly: https://www.mozilla.org/en-US/firefox/52.0/releasenotes/

[lpugin]

Correct! This is a good news. The bad news is that the version of the MEI viewer was build with a pre-release setting and it indeed needs to be rebuild.

[lpugin]

It is fixed. I think we can wait for making it downloadable until all this becomes more stable.

[rettinghaus]

Works great in Firefox! Thanks!

[lpugin]

It also works with Chrome Canary for me, where the speed difference with the asm version is most noticeable (about 5x faster?). Webassembly should be available in Chrome by the end of the month

[craigsapp]

about 5x faster?

Hmmm, I am getting interested in playing around with it now...

How did you compile it? and/or is there a wiki or documentation page?

[lpugin]

I added a --a option to the buildToolkit script which generates the wasm. You should have a look at the mei-vewier-wasm.xhtml page on how to load it. It needs to be loaded asynchronously, so it is a bit different.

You need the incoming version of emscripten (I had troubles with the latest version 1.37.3, see https://groups.google.com/forum/#!topic/emscripten-discuss/Bvr8SWpHXqc ). So as you can see it is still very new and we can have more doc in due time.

One thing I could not get working is the use of the ALLOW_MEMORY_GROWTH option, which would be useful in the future. I was able to compile it with -01 (I think). But then I still have error messages with large files. One possible problem is that the pointer address of the verovio toolkit changes when the memory is growing but I did not investigate this.

[lpugin]

Actually a new version of Chrome (57) was just released with wasm!

[vitto32]

Which version of emscripten should I use? With 1.37.22 I get this error: "Uncaught RuntimeError: integer result unrepresentable" in Module._vrvToolkit_renderPage

[lpugin]

Are you compiling the latest version of the develop branch?

[vitto32]

Yes I'm on develop branch and I used ./buildToolkit -H -a

[vitto32]

No wait I'm on the master branch sorry!

[lpugin]

There is pending issue to be fixed in emscripten that will then allow us to track the runtime error https://github.com/kripken/emscripten/issues/5718 But the develop branch should work.

[vitto32]

It does work and it's so much faster. Thanks!

[craigsapp]

Yes I'm on develop branch and I used ./buildToolkit -H -a

What does the -a option do? As I don't know of such an option in emscripten/buildToolkit. Or is there a different script for compiling WASM? Perhaps you meant -w?

[vitto32]

I was on the master branch (my mistake). On that branch the option for compiling WASM is -a instead of -w.

[vitto32]

I've been testing WASM version of Verovio 2.0 on Android and it works pretty well. Now I've switched to 2.2 and i get

Uncaught RangeError: WebAssembly.Memory(): could not allocate memory
    at verovio-toolkit-wasm.js:1

I've tried increasing Memory (TOTAL_MEMORY and TOTAL_STACK) but I get the same error.

http://www.verovio.org/mei-viewer-wasm.xhtml has the same problem

[samuelbradshaw]

Is using the WASM version of Verovio as simple as changing the Verovio toolkit reference from <script src="https://www.verovio.org/javascript/latest/verovio-toolkit.js"></script> to <script src="https://www.verovio.org/javascript/latest/verovio-toolkit-wasm.js"></script> ?

I'm getting errors in Safari (15.2) and Chrome (97) on a Mac, and I wonder if I'm missing something simple.

[samuelbradshaw]

Update: It looks like I needed to surround my code with this:

  document.addEventListener("DOMContentLoaded", (event) => {
      Module.onRuntimeInitialized = async _ => {
        …
      }
  });

as shown on this page: https://book.verovio.org/first-steps/getting-started.html Now the WASM version of the toolkit seems to be working.