WebAssembly Without Boilerplate
Else you love modern frontend technologies and practices, and use them to develop web apps offering to your users experiences similar to native ones :
damn fast loading time;
nearly no waiting time or UI freezing during information processing.
Concretely, you’re familiar with the actions below to reach these goals :
using tiny yet powerful frameworks (ex: Preat, Redux, StencilJs, Svelte…);
harnessing the Cache and Service Worker APIs (look for Progressive Web Apps) for offline applications;
avoiding DOM accesses (relatively slow) when not absolutely necessary;
using async patterns (Promises, generators) properly;
not declaring new local variables in frequently called functions to avoid too much triggering of the garbage collector (=> temporary UI freezes);
using native ES6 methods when your application target modern browsers;
using Web Workers - to create additional threads - if some tasks can be executed in parallel;
using WebGL to speed up drawings, or heavy operations (scientific libraries, artificial intelligence...).
Still, your application has some bottlenecks. You’ve heard about the WebAssembly revolution, but the situation is not severe enough to rewrite the whole app from scratch in C++ or Rust - that you don’t know. Indeed, your bundle size is not very big, and instead the problem lies in a dozen of slow functions. Moreover, you want to experiment with the WASM technology without learning lots of tools. Above all, you want clear and succinct explanations but less dry than the official documentation. THIS BOOK IS PROBABLY FOR YOU! Indeed, each chapter show practical examples, that you can test in a few seconds by copying and pasting them into your browser console. Also, code samples are littered with detailed comments! For prerequisites, please check Appendix A.0.
Wasm vs. PNaCl Performance Benchmark
With PNaCl recently being switched off within Chrome 76 in favor of WebAssembly, PDFTron benchmarked the performance of Wasm vs PNaCl to compare speed using its Wasm-based WebViewer product. This article outlines the surprising findings (Wasm is slower!) and includes a benchmark tool you can try themselves with your own documents.
WebAssembly: Undefined Symbol _ZN2cv12VideoCaptureC1Ev while compiling OpenCV C++ code
I'm trying to compile my C++ code that uses VideoCapture of OpenCV. Basically I'm trying to display frames of rtsp,rtmp camera within a browser without using a media server. Here are the build modules enabled while compiling OpenCV for emscripten
cmd = ["cmake", "-DCMAKE_BUILD_TYPE=Release", "-DCMAKE_TOOLCHAIN_FILE='%s'" % self.get_toolchain_file(), "-DCPU_BASELINE=''", "-DCPU_DISPATCH=''", "-DCV_TRACE=OFF", "-DBUILD_SHARED_LIBS=OFF", "-DWITH_1394=OFF", "-DWITH_ADE=OFF", "-DWITH_VTK=OFF", "-DWITH_EIGEN=OFF", "-DWITH_FFMPEG=ON", "-DWITH_GSTREAMER=ON", "-DWITH_GTK=ON", "-DWITH_GTK_2_X=ON", "-DWITH_IPP=OFF", "-DWITH_JASPER=OFF", "-DWITH_JPEG=ON", "-DWITH_WEBP=OFF", "-DWITH_OPENEXR=OFF", "-DWITH_OPENGL=OFF", "-DWITH_OPENVX=OFF", "-DWITH_OPENNI=OFF", "-DWITH_OPENNI2=OFF", "-DWITH_PNG=ON", "-DWITH_TBB=OFF", "-DWITH_PTHREADS_PF=OFF", "-DWITH_TIFF=ON", "-DWITH_V4L=ON", "-DWITH_OPENCL=ON", "-DWITH_OPENCL_SVM=ON", "-DWITH_OPENCLAMDFFT=ON", "-DWITH_OPENCLAMDBLAS=ON", "-DWITH_GPHOTO2=ON", "-DWITH_LAPACK=ON", "-DWITH_ITT=ON", "-DWITH_QUIRC=ON", "-DBUILD_ZLIB=ON", "-DBUILD_opencv_apps=ON", "-DBUILD_opencv_calib3d=ON", "-DBUILD_opencv_dnn=ON", "-DBUILD_opencv_features2d=ON", "-DBUILD_opencv_flann=ON", # No bindings provided. This module is used as a dependency for other modules. "-DBUILD_opencv_gapi=ON", "-DBUILD_opencv_ml=ON", "-DBUILD_opencv_photo=ON", "-DBUILD_opencv_imgcodecs=ON", "-DBUILD_opencv_shape=ON", "-DBUILD_opencv_videoio=ON", "-DBUILD_opencv_videostab=ON", "-DBUILD_opencv_highgui=ON", "-DBUILD_opencv_superres=ON", "-DBUILD_opencv_stitching=ON", "-DBUILD_opencv_java=OFF", "-DBUILD_opencv_java_bindings_generator=OFF", "-DBUILD_opencv_js=ON", "-DBUILD_opencv_python2=OFF", "-DBUILD_opencv_python3=OFF", "-DBUILD_opencv_python_bindings_generator=OFF", "-DBUILD_EXAMPLES=OFF", "-DBUILD_PACKAGE=OFF", "-DBUILD_TESTS=OFF", "-DBUILD_PERF_TESTS=OFF"]
The error message I get is,
error: undefined symbol: _ZN2cv12VideoCaptureC1Ev warning: To disable errors for undefined symbols use -s ERROR_ON_UNDEFINED_SYMBOLS=0 error: undefined symbol: _ZN2cv12VideoCaptureD1Ev
#include <emscripten/bind.h> #include <emscripten/val.h> #include <opencv2/core/mat.hpp> #include <opencv2/imgcodecs.hpp> #include <opencv2/opencv.hpp> #include <opencv2/objdetect.hpp> #include <opencv2/highgui.hpp> #include <opencv2/imgproc.hpp> #include <opencv2/videoio.hpp> #include <iostream> #include <unistd.h> #include <string.h> #include <stdio.h>
Here is a list of Header files that I'm using in my program
Graphical application to serve WebAssembly modules
WebAssembly Visual Server is a small, cross-platform graphical utility that serves WebAssembly modules locally, eliminating the need to configure and run a full-featured web server for development. It can also open a page with the module already loaded, compiled, and instantiated, for easy access in the console.
Google Earth In The Browser With WebAssembly
So what did the conversion involve? Earth is a C++ application and the faithful Emscripten compiler did the work of converting it to WebAssembly. This is far from just a translation of the C++ to WebAssembly. The compiler also has to convert POSIX calls to something that works in a browser. It also converts OpenGL calls into WebGL. At the end of the day you still need to do some manual work to get the code working correctly.
The Google blog post also suggests what might be next for WebAssembly:
Google IO: WebAssembly for Web Developers
🐘+🦀+🕸 php-ext-wasm: Migrating from wasmi to Wasmer
How php-ext-wasm has migrated from wasmi to Wasmer and now enjoys a 29x speedup, is faster than PHP itself, and is closer to native speed.
The PHP virtual machine (VM) is Zend Engine. To write an extension, one needs to develop in C or C++. The extension was simple C bindings to a Rust library I also wrote. At that time, this Rust library was using wasmi for the WebAssembly VM. I knew that wasmi wasn’t the fastest WebAssembly VM in the game, but the API is solid, well-tested, it compiles quickly, and is easy to hack. All the requirements to start a project!
Programming using Web Assembly
As I described in a previous post, Web Assembly is intended as a target language for compilers, not as a general-purpose language for programmers. In other words, you’re not supposed to write programs in Web Assembly itself but instead write in a higher-level language then compile it into Web Assembly.
I first met assembly languages on 8-bit microcomputers where they were used to write software that ran as fast as possible on what was by modern standards very slow hardware.
Even though Web Assembly is not intended as an application programming language, I wanted to have a go at programming with it, so I coded a simple module that calculates the Mandelbrot Set to be rendered on an HTML canvas.
Read the article: https://medium.com/@alexc73/programming-using-web-assembly-c4c73a4e09a9
Announcing WAPM: The WebAssembly Package Manager
Today, we are releasing a new tool that will help you use WebAssembly anywhere: WAPM (aka WebAssembly Package Manager).
This release includes:
A command line application: wapm, included when you install Wasmer
A website and package registry: wapm.io