Hacker News Reader

Comment by billyhoffman | Hacker News Reader

The site owner should seriously consider running these SVG images through "scour" because each image is roughly 2X the size it should be.

Since SVG images are using XML, they can be minified just like JS, CSS, or HTML documents. Scour is a python script that does just that, but is SVG aware so it removes unused XML attributes, etc. Like any lossless optimization, the resulting file is a pixel perfect copy (can you still say that for vector images?)

Does this really help. Yes actually. I'm getting over 800 KB of savings across all the images applying scour.

https://my.zoompf.com/s/165313?tid=im&srt=sev&asc=false&pgo=...

View on HN

Depends, though - speaking from the perspective of a front-end developer/designer, it's almost universally preferable to have the non-minified versions of any image, and in this case, being able to easily work directly on the XML is a massive plus. Ideally they should be minified as part of a build step. A minified version for prototyping/rapid development would be handy though.

I completely agree. Keep original unminified versions of all of your resources, and do the optimizations as part of a build process, so your production visitors are getting the smaller version

Yeah, that's the point. I think it's best to have the proper unminified version and do as you please

Scour isn't 'lossless'. "Scour attempts to optimize the file, and as result, it will change the file's structure and (possibly) its semantics"

Scour can do things like change Ids, remove 'unused' data, and so on - but if you are planning on operating on the SVG using script, maybe you need those IDs or that data.

No no no! Plz do not shrink them! Every developer knows how to shrink SVG. But it's really hard to get nice readable SVG back from shrinked ones. Better this way...

There isn't much you can do to SVG to hurt readability, actually. Scour mostly removes things such as superfluous IDs, superfluous elements in <defs> that are not used, shortens IDs, rewrites CSS into XML attributes where appropriate, removes attributes that replicate defaults, rewrites paths with a bit less whitespace and most importantly reduces the accuracy of numeric constants. The latter is in many cases the greatest reduction. And you don't notice the difference between 8 digits after the decimal point or 5 (unless the local viewBox is seriously fucked up).

`xmllint --format` is probably pretty good at recovering readability.

Reply on news.ycombinator.com