Introducing WebAssembly support in VTK

Introduction

There is increasing demand for powerful, interactive data visualizations directly within web browsers. VTK.wasm is a technology that aims to provide this capability by delivering complex visualization applications without requiring traditional software installations. Not only are these applications portable, but they provide performance at near-native speeds. 

In this post, we describe some recent steps that have enabled us to deliver such capabilities in the browser using WebAssembly.  These efforts lay the foundation for portable medical and scientific computing tools powered by VTK. Developers can now use the power of VTK.wasm to build web applications using C++, Python, and JavaScript (JS). In addition, we’ve made compiling VTK for WebAssembly much easier, transforming what was once a complex and frustrating process into a smoother experience. 

(This is a post in a series of blog articles about current VTK Innovation efforts. See the first, introductory post here.)

Why WebAssembly?

WebAssembly (abbreviated WASM) is a binary instruction format intended to be executed in a virtual machine, for example in a web browser. The key benefits of WASM as a compilation target for the VTK community are:

1. Portability: Static web sites can be served on a domain for anyone to access. Users with a fairly recent browser can easily run the application without going through installation steps.
2. Security: WASM executes code in a sandboxed environment that prevents buffer overruns and/or illegal memory accesses from affecting the host system.
3. Near-native performance: Visualization applications can readily be created for large and complex data, with the caveat that applications must be carefully designed to achieve speeds close to native capabilities. For example, performance is typically hampered with WASM runtime calls into JS. Crossing this barrier involves marshalling the arguments and return values which typically makes many copies of the data.

Easy to Build and Deploy

We reworked the CMake support code in VTK to use the Emscripten SDK. Emscripten, by default, generates binaries with support for 32-bit memory. This places an upper bound on the maximum memory available to a wasm application (4 GB). Emscripten has a `-sMEMORY64=1` flag which enables 64-bit memories in wasm. The max memory in a 64-bit wasm application is 16GB. This limit is set by browsers and additional work is required to increase that limit. We addressed many compiler errors and runtime errors that appeared when building VTK for wasm64. We then published both 32-bit and 64-bit wasm builds with async support, reduced the memory usage, and enabled faster startup times. We refined the packaging and build configuration process to make it easier for developers to work with VTK.wasm. The bundles are now distributed as separate .wasm, .mjs and JavaScript loader files that allow different kinds of integration using modern bundlers. Learn more about building VTK for wasm in VTK docs.

Improved Testing

We have enabled dedicated continuous integration (CI) pipelines for VTK.wasm. This helps expose and resolve issues as and when they arise due to developer’s merge requests. The CI pipeline also runs unit tests with regression image testing. These unit tests are automatically run in a special edition of Google Chrome for Testing (CFT). Kitware, along with open-source communities such as the VTK community, are committed to developing and deploying high-quality software—routine use of CI processes ensures this. Learn more about testing procedures in VTK docs.

Ways to Use VTK.wasm

In upcoming blog posts, we will dive into the details of three different approaches to using VTK.wasm:

1. Extend the functionality of VTK with your own C++ code and ultimately leverage your extensions to build 3D web visualization apps.
2. Use within JavaScript without any C++ knowledge by leveraging the WASM bundle (generated to support the trame visual analytics framework).
3. Use VTK.wasm through Python via trame—learn about this in our recent blog post.

Acknowledgments

VTK is a creative work produced from an extended community. Refer to VTK’s GitLab repository for a detailed capture of contributions and enhancements. Much of this work is supported under an NIH R01 VTK Innovation grant 2R01EB014955-09, Accelerating Community-Driven Medical Innovation with VTK.