react-konva

I can only give you the reasons why I picked canvas. So here you go. 1. Scroll performance is much better than HTML 2. Drawing on canvas is cheap compared to modifying DOM or attributes 3. Streaming updates are much smoother in canvas as drawing is quick. I had used Canvas as an interface for high-frequency trading 4. Canvas is easy to work with. And with Konva - https://github.com/konvajs/react-konva/, any React developer will find it at home 5. No Browser bugs :) 6. Performance tuning is quicker with Canvas 7. In the future, we can decide to use WebGL (using PixiJS) Some problems with canvas IMO 1. There is no relative positioning :(. It sounds silly, but coming from HTML, any element can be positioned relative to its parent. 2. Styling/Pixel ratio/Stroke - can be hard to figure out first. And the 0.5px crisp stroke workaround on DPR 1

Flipboard did exactly this with react-canvas[0]. Runs nice enough even on older devices (try this[1]), but it completely decimates accessibility. Looks like there have been attempts with Konva too [2]. [0] https://github.com/Flipboard/react-canvas [1] https://flipboard.com/@flipboard/flipboard-picks-8a1uu7ngz [2] https://github.com/lavrton/react-konva

Been using this for a new project for a few months [0]. Cannot speak highly enough about it - Thank you Anton [1]! [0] specifically the react package https://github.com/lavrton/react-konva [1] https://lavrton.com/