...so recently i was playing with SVG, and i wanted to embed an older version of
this map of Europe into my html . Currently it is about 500 KB, but as far as i remember, it was even heavier. Pretty bad, if you want to inline it, and your visitors have to download it. So how did i reduce the size to
one tenth of it?
gzip?Yes, gzipped version of SVG exists, but not when you inline it, so its a no-go in my case.
delete unnecessary regionsI didn't need Greenland and Russia for example, so i just erased them from the source file.
delete unnecessary metadataMy file was scattered through with inkscape:xyz and some other editor's metadata, which might be useful when editing the file, but useless when i publish it on the web. They had to go.
group and style wiselyDon't repeat the same styles/transformations on many elements, use grouping instead (<g> element)
remove unnecessary transformationsA lot of my regions contained a very little translate transformation, which had no visible result at all, so i chucked them out.
compact path dataAccording to the
SVG specs, you can reduce the size of your path data by removing redundant white spaces from around commands and coordinates. Works great!
simplify path dataOk, this one you will not be able to do in your text editor. The idea is to reduce the number of coordinates required to describe a path. Even if it means you will have a less precise path, the result might be satisfying. To do this, you have to have
Inkscape. Select an area, and you will see in the status bar the number of nodes it consists of. Now select path/simplify from the menu. If you are lucky, your number of nodes will be less, if you are not, it will actually be higher:) For me it worked best, when i set the simplification threshold (Edit/Preferences - Misc) from 0.0020 to 0.01. Yes, you will have visible deviation from the original path, but in my case it was acceptable. Also note, that under a certain number of nodes (for me it was around 80) it is not worth to run the simplification.
reduce coordinate precisionOk, so i still had (and you will most likely have) a precision of four decimals in my path coordinates. What if i reduce it to 3/2/1/God forbid zero ?! Yep, no visible impact on the web, but huge saving on the filesize! This is the ultimate file size killer, if you can afford it.
NOTE: Other good tips you can read
here and
here.