3 ms·
I have a large SVG calculation occurring with every rendering. Essentially, the code generates millions of SVG polylines based on a pseudo-random generator, the
by chilling 3y ago
I have a large SVG calculation occurring with every rendering. Essentially, the code generates millions of SVG polylines based on a pseudo-random generator, then needs to stringify them and post them inside the canvas.
- solardev 3y agoWhat are the constraints? Does it have to go through an SVG intermediary (as opposed to raw pixel math, for example)? Does the canvas have to be responsive? Can you use GPU calculations? I don't know what you've tried already, but typically SVGs are very slow to work with. If you're drawing to a canvas anyway, you should see if you can skip the XML altogether and do the math to draw directly to the canvas (or use a helper lib like Konva or Pixi or D3 etc.). Can any of the line generation and stringification be offloaded to WASM, which can often be several times faster than JS? Can any of it be offloaded to a GPU, depending on which platforms you need to support? I'm still not sure what the actual use case is for a bunch of random polylines (is it a visualization of something? a scientific calculation? background graphics?). If they don't represent any actual data and are just a graphical nicety, can you fake them somehow (bitmap sprites with different transformations)? And does it have to happen client-side in real time (can you just prerender it?)?