Webassembly “both async and sync fetching of the wasm failed” issue

Trying the Webassembly

While porting the C++ Starfield code to WASM (see it live, C++ on the web) I had a hard time to make it work, despite the succesfull compilation process. One can’t read the whole documentation at once nor find the right information in a second, thus it took me a few hours to solve.

Sample C++ code as Webassembly

Funny thing was the frozen screen from the Starfield showed up only in Edge. Fireofx was hanging at the Emscripten template and Chrome additionally showed the mentioned phrase: both async and sync fetching of the wasm failed.

Somehow I managed to extract the error mesage from the FF console, something like: emscripten_set_main_loop_timing: Cannot set timing mode for main loop since a main loop does not exist! Call emscripten_set_main_loop first to set one up

At first I thought… well here we go again, there must be always a hidden problem in that software which gonna hold you down. They just can’t make things work from the start. Man it’s XXI… I was really tired. Fortunately that main loop reminded me the standard Arduino coding convention, and that was it. Same kind of the loop is used in browsers for creating smooth and responsive apps.

Just had to remove the main loop (for or while) from the code, make it a callable function and pass it to the emscripten_set_main_loop(…).

Here is the description:

The Starfield ESP8266 demo – and running on the web, made with WASM


Get the Arduino code for this effect

Here are the two compiler commands which allowed me to compile it successfully with the SDL2.

emcc main.cpp -std=c++11 -O3 -v --bind -s USE_SDL=2 -s WASM=1 -o starfield.html --shell-file shell_minimal.html

emcc main.cpp -std=c++11 -O0 -g -v --bind -s ASSERTIONS=1 -s USE_SDL=2 -s WASM=1 -o starfield.html

The first one is O3 – optimized, with the minimal HTML template, the second one is the basic command I used to make it work for the first time. I’m leaving it this way, without any further optimizations.

I have looked through dozens of websites to find the solution and decided to gather the most critical ones, containing great information, that might be useful in the future.

Download and install: https://kripken.github.io/emscripten-site/docs/getting_started/downloads.html

Compiling an example: https://developer.mozilla.org/en-US/docs/WebAssembly/C_to_wasm

Verifying the Emscripten Development Environment: https://kripken.github.io/emscripten-site/docs/building_from_source/verify_emscripten_environment.html

Emscripten SDK: https://github.com/juj/emsdk

Get the Windows command prompt: https://kripken.github.io/emscripten-site/docs/tools_reference/emcmdprompt.html

Building to WebAssembly: https://kripken.github.io/emscripten-site/docs/compiling/WebAssembly.html

Emscripten Compiler Frontend (emcc) args/options: https://kripken.github.io/emscripten-site/docs/tools_reference/emcc.html

FAQ: https://kripken.github.io/emscripten-site/docs/getting_started/FAQ.html#faq-my-html-app-hangs

"Porting an Asteroids clone to Javascript": http://tristanpenman.com/blog/posts/2018/01/08/porting-an-asteroids-clone-to-javascript/

"Compiling to WebAssembly: It’s Happening!": https://hacks.mozilla.org/2015/12/compiling-to-webassembly-its-happening/

Leave a Reply

Your email address will not be published. Required fields are marked *