Since its inception, WebAssembly has given the front-end a broader application imagination. Graphics, video rendering, clips, codecs, and games are all likely to be produced in browsers based on WebAssembly.

What is a WebAssembly

WebAssembly (WASM) is an efficient, cross-platform binary code format that contains binary files that can be efficiently loaded, parsed and executed by browsers on all platforms.

As long as the browser supports WASM, users can use the functionality provided by WASM, which means that the cross-platform of WASM is actually cross-platform based on the browser. When upper-layer users compile WASM, they don’t need to care what the underlying architecture is, as long as the correct binary is compiled, it will run in every supported browser.

Wasm enhances the power of JS. The things that JS is not good at, such as drawing, encoding, decoding, mathematical calculation, etc., can be implemented in WASM, and then JS can use the power provided by WASM.

Many WebAssembly applications already support WASM, such as FFMPEG codec, Unity 3D, Unreal Engine, Google Earth, etc.

How to use

WebAssembly now supports compiling from C/C++, GO, rust to WASM modules. Using emscripten SDK, you can directly compile the C/C++ source code into a WASM file, and then load it directly in the web page. Reference emscripten.org/docs/gettin… Get started. Reference emscripten.org/docs/compil… Compile the project.

But how to call wASM methods from a web page. Two ways:

  • Export wASM methods to the JS runtime directly using the underlying functions provided by Emscripten.
  • Use embinding to export c/ C ++ functions and classes directly and then call them in JS.

If you apply it to a video clip

Based on the capabilities provided by WASM, ffMPEG decoding, image decoding, OpenGL, multi-threading, and video clip applications are shown below. This series of articles, which will be updated from time to time, introduces the architecture and technical principles based on this diagram:

See the online demo: Cloudedit.atvide.cc

Limitations and risks of WASM

Limitations and inconveniences of WASM

  • Running in a sandbox, wASM has the same limitations that web pages and JS have, such as cross-domain
  • Files on the user’s computer disk cannot be read directly
  • There is a limit to the maximum amount of memory that can be used, which varies from browser to browser, but is typically 2 gb
  • Multithreading (based on worker and SharedArrayBuffer) is currently supported, with SharedArrayBuffer not enabled by default in some browsers
  • The memory allocated by WASM must be manually released

The risk is not so much in the technology itself, but in how it is used. There have been mining procedures based on WASM technology development, virus and so on. Since WASM is a lower-level binary format, web side security checks and intercepts in this area are not yet mature. Sites that use WASM at this stage may present a greater security risk.

As browsers improve wASM, more features will be supported. Better exception handling, such as GC, will enable more efficient and comprehensive functionality.