i have 15-20 svg images used in my project and all of them are above 100 kB, each one around 200 kB to 300 kB. can it cause a performance issue ? i am unable to reduce size further and i tried inkscape and other options.
any suggestions ?
thanks
I guess it affect the screen loading performance
Maybe u can pass them to .png and make them really tiny with tinypng.com
Also there are .svg compressors online World's Best SVG Compressor
Cheers
That doesnt sound like its too big. Unless maybe if you show them all in one page.
Really depends what the svg's are and what they are used for. and what devices you are expecting to show them on.
It also depends how you made the svg... Maybe replacing a "complex" path with a with a border radious will look almost the same but takes a little less size.
it is just graphics for motor/pumps and they will never be all on one page. it will be max 4-5 of them on one page. i will try building page and see how it goes. just worried if it gives trouble lately then could be a big problem.
Thanks. i need to animate so i thing .png will not help. also svg compressor do not reduce it much as well. i think it has came from CAD drawing and original size for 700 kb which i reduce to 250 kb using inkscape and unable to reduce further even with svg compressor
1 Like
could you show one example of the larger ones?
Like the whole svg file, not just a screen shot
2 Likes
I used a CAD to SVG converter once and it made a really big SVG for a simple drawing. If you need a smaller SVG I would recommend tracing the cad drawing in inkscape and saving as "optimized SVG". It's tedious but it allows you to draw things much more efficiently.
1 Like
You can import things like CAD files into Inkscape and just self optimise them, normally I find that a lot of SVGs use tiny straight lines instead of paths like we would expect, and you can use the "simplify" on complex curves to get better approximations with less definition text.
1 Like
This is likely where the issue came from, if you open the file in Inkscape, you will see that things like text are not listed as text, instead they are lots of tiny lines. I normally remove all text and remake it with actual svg text elements, and remove any elements that are unnecessary like title blocks and borders. You can also combine lots of the individual object into single paths and that will condense things a lot. If you post an example svg, we might be able to give better comments.
Attached are two different version. one is i received from CAD Export which is around 975kb, 2nd one is i could reduce it to 292 kB. i want to make it below 100 kB for using it in ignition perspective
will this help ? i did uploaded file, i am not sure if you can download it. if not please advise how i can attached that to this post ?thanks.
16Kb.
You need to delete all the tiny lines and points in it until it is an outline then it is small.
3 Likes
I dont have time to fully min max the pixels, but this bit can be done in one line
(colored it to show)
<rect xmlns="http://www.w3.org/2000/svg" width="1150" height="125" x="340" y="1400" style="fill:rgb(0,0,255);stroke-width:3;stroke:red"/>
altho yh 16kb is good enough 
1 Like
There is definitely more you can do, all I did was delete useless features, no optimisation.
2 Likes
yeah just removing those shadow lines, is enough, you can keep a bunch more details from the original cad too, just gotta get rid of those detail/shadow lines.
Does cad have no better export methods? This seems likea very weird way to export as svg
1 Like
@David_Stone optimized version + SVG compressor World's Best SVG Compressor 12kb
You probably can go even further.
1 Like
do you mind giving some explanation about how did you do that ? did you use inkscape to delete unnecessary path ?
That is 15kb...
3 Likes
Yes, I opened it in Inkscape and jsut used the node editor tool to select and delete unnecessary paths and nodes.
The blue one above I basically traced over the original and then coloured it in with the eyedropper tool.
3 Likes
Thanks David. i am able to do it now. appreciate it very much
This is probably one of the few times i see inkspace svgs on here that uses rects instead of only paths.
I assume you have to use a different pen/brush for this? Like a basic shapes one?
Very nicely done, it is so much better to use basic shapes when possible.
(i have never used inkspace)
1 Like