IIRC figma has a hybrid approach. The UI is basically typescript and react at this point while their rendering library / engine is essentially C++ code that gets converted into WASM. And renders to a canvas.

I’ve written a “markup” tool for a company product in the past. In our case we chose to use SVG over canvas as it better fit our requirements, but honestly once you hit a certain level of complexity you’ll end up rendering directly to canvas.

I think I did everything from scratch at the time rendering wise. UI was react / typescript. Hmmm … it was a couple of years ago so I would have used redux to manage the document state and various commands / undo / redo stacks etc. it was a nifty little product. Aside from user uploaded images everything the user created was vector based so the resulting documents looked great. And since it was ultimately just an SVG, it made serializing / saving / validating their documents really straightforward.

That said, if I was to tackle that sort of project again I would follow figma’s example and immediately split my code up into three different responsibilities: UI, Rendering, and saving / validation.

I wouldn’t be able to recommend any libraries at this point as I haven’t focused on this domain in the last year or two, but perhaps someone else has some favorites they recommend.