I am always looking at ways to streamline my workflow, and I recently discovered a great little npm utility called SVGO .
This neat little package can be run from the command line, and greatly reduce the contents (and therefore size) of SVG files.
Take for instance my logo. In a previous post I talked about stripping out the unnecessary content manually using Sublime Text. That whole time I could have been using this tool to reduce my development time!
It's really easy to install. You simply need to type this single command into the terminal:
Then to simply clean up a single svg, you run this command (obviously being in the same folder your file is, or add the path at the start of the file name):
Or save it with a new file name in the same folder:
This is what it looked like when I created the SVG in Adobe Illustrator:
And this is it afterwards:
You can also optimise multiple SVGs in the same folder in one command, or even set up a Grunt task. Even more options are available.