SVG loadtimes vs. basic graphics

We are considering using the SVGs in perspective for a client, but we are concerned with mow much extra stress this might put on their network and the server. A lot of their users may be in areas where cellular service can be spotty. Can you give me an idea how much “bulkier” the screen will be for data between these two designs that are pictured? Also, we do realize that I am showing you a picture of the vision client, not perspective. We are going to build similar pictures in vision.


Here is a picture of what I mean by “basic graphics”

Thanks a bunch

SVGs are typically very small sized files. All they are are essentially XML documents with path coordinates and such. (Open one in notepad and have a look).
They’ll be particularly small if you use graphics that comply with the situational awareness standards (ASM Consortium / ISA / HPHMI)

I test this before. For small icon object(24*24) png files are smaller than complex svg shape but for larger size is not true.
When say complex object imagine for example gear shape has a lot of point to define the shape.
One simple way to see this create svg and make a png of it and compare size. In my experience in overall complex objects in svg use more size but when you compare a svg tank, pipe ,… they smaller size than png.
Also svg are better for animation, and you can dynamic thier element easily.

1 Like

To add to svg benefits, they also scale, whereas PNGs are raster so they don’t scale

It’s better to use images for complex objects like gears in above example and svg for primitive like pipe or tank etc . Images also scale but they may get pixelated but that’s a minor issue. Secondly the background xml or JSON files defining the graphics can be optional cached on clients so that only foreground data only needs to be fetched in real time, so size of drawing may not be such a serious concern .

They will become pixelated when increased in size (there’s no maybe), and if you want a professional outcome, you don’t want pixelated graphics in your applications.

1 Like

Agreed , but I meant from reducing XML or json file size point of view. Each vector of an svg primitive will take one XML node or json object and there will be several such primitives required to define a symbol, where as if it’s an image it will be just one XML node or json object plus of course the image size. So there is a trade off between file size and drawing quality. (Scada Vs cad I guess )