Thankfully, there is a webassembly compiler toolchain called Emscripten that can easily compile your C/C++ code. For our use case, we are going to compile a single program. So, we could simply call the
emcc compiler instead of
g++. If you have a bigger project that uses something like CMake, emcc can still compile it without any issues.
To avoid the hassle of setting up my own build environment, I went the docker route. If you are not familiar with docker, I will cover it in another post. For now, think of it as a virtual machine that comes with all the dependencies needed to do a specific task (in our case, compile programs with emscripten toolchain).
Create function that solves the Nqueens problem. There is a
GetNumSolutions function that returns the number of possible solutions and a
GetNextSolution function that returns the array of results in sequential order every time it is called. I have marked these three functions as C by wrapping them around
extern "C". Finally, I have added a tag
EMSCRIPTEN_KEEPALIVE for these functions to let emscripten know that these functions should not be optimized out since they are not called. Note how we don’t have a main function.
How to compile this program?
Emscripten website has excellent documentation. You can consult that site for more details. For our case, I used the following command on my Windows machine to compile the C++ code to Webassembly.
This command emits out two files:
a.out.wasm is the binary file containing our compiled code - much like an object file. Our implementation is completely hidden. Great!
number for pointers. You can find more information about different types that are available here.
How about a live demo? Of course. I am using the same frontend code as last time. But, in the new version, I am using the Webassembly interface described above. This means, we are actually running C++ code in the browser. Hurray! Hit me up if you have any questions.