3 ms·
Thank you! Unfortunately my macbook is old and does not support WebGL. I am using a lot of WebWorkers for the rendering. The code is using a mix of SVG and Ca
by HugoDaniel 9y ago
Thank you!
Unfortunately my macbook is old and does not support WebGL.
I am using a lot of WebWorkers for the rendering. The code is using a mix of SVG and Canvas.
I don't know if I can explain it here in a comment. Roughly in the final passes I am preprocessing SVG paths into Path2D's[0] that then get rendered into an offscreen canvas. (they get cached)
The rendering code keeps 4 offscreen canvases, one for the layers bellow the current layer, one for the current layer, one for the layers above the current layer, and finally one for the HUD (the grid lines and zoom info).
These offscreen canvases are then rendered into many final canvases on the DOM in different ways (to do splitting animations, like row splitting or column splitting that happen to allow the UI to react to some specific user interactions like editing a grid element).
This way the rendering is smooth with simultaneous users on the same project on my old hardware.
I am planning to package this specific rendering part into npm and release it soon.
[0] https://developer.mozilla.org/en-US/docs/Web/API/Path2D https://developer.mozilla.org/en-US/docs/Web/API/Path2D