Best 2D rendering for WASM

[elliottslaughter]

Hi all,

I'd like to pick your brains on possible libraries to use with a new Rust/WASM project. We need 2D rendering capabilities like rectangles, lines, and text, with the ability to intercept mouse events (click, hover).

The project is (partially, but not entirely) a port of an existing JavaScript profile viewer that we wrote in D3.js. That was pretty good for our first version but we've really suffered as we've tried to scale it, even with tricks like aggressively pruning the number of boxes that we show (and aggregating smaller boxes).

If you want to play with a live example, you can see one here. Click on the triangles to expand the timeline so you can see the individual tasks.

http://sapling.stanford.edu/~eslaught/legion_prof/?start=103004.29543937708&end=152042.45672969965&collapseAll=false&resolution=10

We have a Rust backend for this now which has been highly successful, and gave us about 20x speedup over the previous Python script (running in PyPy, not CPython, which was even slower). Now we want to work on the frontend component. The goal is first, to fix the constant factors by switching to Rust/WASM (at least for everything that is compute or memory intensive) and then second, to move to a more dynamic / adaptive model so that we don't pay loading cost linear in the total size of the profile (i.e., a profile of any size should be able to load almost instantly, and then you pay only for what you want to view, like Google Maps). (This second point is a lot more speculative.)

Any ideas? I know WASM has access to WebGL, but it seems like a lot of work to do WebGL from scratch just for rendering some boxes and lines (and text). If there were something preexisting that was high quality, with the right feature set, and not too heavy, that seems like it would be a big win for us.

Thanks in advance!

[Aiden2207]

You could give macroquad a try. It is a full-fledged game engine, but it's actually pretty simple and lightweight. It comes with a hand-rolled js-wasm interface, so you don't have wasm bindgen or anything like that. It's still fairly unstable and sparsely documented, though.

[Michael-F-Bryan]

One solution I've used in the past is the piet crate. It provides abstractions for painting on a 2D canvas, and you can use the piet-web backend to link it up to a HtmlCanvasElement.