What are some options for optimizing SVG? [closed]
Solution 1:
SVG-Cleaner seems to work perfectly: much faster thanb others, better compression, robust in my tests, batch folder proccessing, and hey! a windows installer for us lazy people!
My try: Original file size: 241 KB, after InkScape delete refs: 149K, cleaned with the tool: 38 KB, cleaned and compressed: 5 KB (.sgvz file extension).
I tried to open the last one, expecting a blank drawing... But my graphics were still there intact!
Download it here (Windows, Ubuntu, or Source)
Solution 2:
I can recommend Scour as I have used it a lot myself when cleaning off unnecessary cruft from SVG files, which is something of a hobby of mine.
An example scour command line which might serve you well (and which I tend to start from):
scour --enable-viewboxing --create-groups --shorten-ids --enable-id-stripping --enable-comment-stripping --disable-embed-rasters --remove-metadata --strip-xml-prolog -p 9 < old.svg > new.svg
Be sure to compare the old with the new to make sure it didn't wreck anything and try lowering the -p decimal precision (the default is 5 if you don't give one); at some level it probably starts distorting things pretty badly, but one or two decimals higher should look good.
If you want to take on a more manual approach, there are lots of tricks of the trade gathered in the Kilobyte SVG Challenge changesets, which are meant as a kind of combined learning and teaching place for this kind of thing.
Yes, you can embed a font in the SVG file, or link an external one, as demonstrated by Mike Bostock's take on the WebPlatform.org logo (non-html-wrapped version here).
It is of course far easier to accomplish this if you have detailed knowledge of what fonts are used than if you pick an arbitrary pdf and convert it; I do not know of any tools that create a no-name font from whatever glyphs the original pdf embedded without you doing most (or all) of that work yourself.
Furthermore there is a growing list of SVG optimization tools in the Kilobyte SVG Challenge README's Tools section.
Solution 3:
I've recently started to make a Python program to optimise SVGs, which you can find at: https://github.com/petercollingridge/SVG-Optimiser
There's a very preliminary online version at: http://petercollingridge.appspot.com/
With more information at: http://www.petercollingridge.co.uk/blog/svg-optimiser
It's far from complete and probably highly buggy, but it deals with some of the issues Chasbeen mentioned such as removing unnecessary precision and default style attributes. It can also strip out unnecessary attributes and namespaces if you know what you're looking for, and will convert styles to CSS which makes it easier to see how they could be improved.
I don't really understand what you mean about embedding fonts. If you paste an example fragment of the SVG showing the gyphs and multiple character elements, I might be able to include a method to combined them.
Solution 4:
https://github.com/svg/svgo
sudo npm install -g svgo
to optimize all svgs in the current directory:
svgo -f .
If you don't have npm, you can install it on Ubuntu like so:
sudo apt-get update && sudo apt-get install nodejs-legacy npm