Show HN: Vecta.io - Team diagramming with an advanced SVG editor

Thanks for the feedback, will surely look into it.

1. We tried drawing libraries before using something in house. In fact what we have now is actually the 3rd version, where we throw away 2 previous versions that is not working as well as we would like. 2. We do not store SVG objects as JS object as we think that will be too memory intensive on a browser. What we have are wrappers, that will take SVG and wrap it internally as objects and to have a consistent and easy way to manipulate them, and once done working with them we throw them away. For example, we have wrappers for rectangle and ellipse and they both uses .move(x,y) and .size(width, height) which is more consistent than using SVG which requires x, y, width, height for rects and cx, cy, rx, ry for ellipses.

In addition, we have plans for opening up our API, so that people like yourself can build solutions on top of Vecta, right now you can play with it programmatically by opening your console, and typing Vecta. This single namespace allow you to access the page or shapes, Vecta.activePage.shapes, or you can set color to the first shape with Vecta.activePage.shapes(0).style('fill', '#ff0000');

4. We use document fragments to render to shadow DOM and write it to DOM, using in house code. However, we have found that what really matters is not so much of speed offered by rendering to shadown DOM but instead of the calculations we have to make internally like making sure the center of rotation and the tight bounding box. These, due to the inability of browsers to calculate them accurately, we have to make.

5. No, we rely on DOM and classes and wanted to keep things simple, so we have objects that handle the handles (no pun intended).

6. We use firebase. It not only handles our collaborative editing well but also allow us to generate previews, smooth and easy login, upload to storage, etc. We love firebase!

7. We do abstract mouse events, key events and many others with internal objects. These objects provide more information, like which shape the user has clicked on and therefore makes the entire task of handling the editing far easier, and we use JQuery for it's ease of use and cross browser compatibility.

8. There is no such thing as 2 users modify the same object at the same time, as one is always slower than the other. The slowest one wins. Say, I drag the object right and you drag it left, if you do it later, then the object is gonna go left.

Hopes that helps! Thanks for asking.

Oh we weren't aware, thanks for telling. But we're hopeful to do more than that rather than just simply svg editing :)

Thank you for the technical details. Probably a bit late for you guys, but we offer a BaaS tailor-made for this sort of product. For instance you could add multiple mouse tracking and selection awareness in a matter of hours with our APIs. Check out our diagram demo for a taste: https://convergencelabs.com/demos/

I like the idea -- this is something I would use and pay for if it were good enough.

Advice, in addition to all the other advice here:

- Connector line routing needs to be good (currently it doesn't really work) and if it were great then that would be a huge selling point.

- You should consider including a ton of "Cloud" (AWS, Azure, Google) symbols and icons out of the box. There are crappy ones available free from Amazon, that would be a start at least. I think "cloud architecture" is one of the biggest use-case for diagramming software right now.

- Not sure if you're using SVG as the native format but if not, consider it. The main reason I didn't upgrade to the new OmniGraffle was its so-so SVG support. Imagine a use-case where people collaborate on a drawing and then store the result in Git, maybe do some batch editing elsewhere, then need to get it back for more visual editing.

- If you want to get traction in the Enterprise world (the horror!) then you probably need a Confluence plug-in at some point.