Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Reduce SVG icon file size #2799

Merged
merged 1 commit into from Feb 26, 2017

Conversation

@Kissaki
Copy link
Member

commented Jan 31, 2017

Use Inkscape File -> clean up document functionality to remove SVG bloat.
This does not even remove all Inkscape specific metadata, but already
hugely reduces file size (and complexity).
before: 1.432.192 bytes, after: 633.535 bytes

It seems this function was previously called "Vacuum defs" in Inkscape,
and the savings we see are in large part due to removal of unused defs.

In some files it also changes the way paths are defined, but without
obvious visible changes.

The files still contain Inkscape metadata like the window size, version
and workspace position that could be removed without losing useful SVG
information.

Also note that for the file publicdomain/Information_icon.svg as well as
the layout_* files this process would actually increase file size as
Inkscape adds additional metadata. Hence that file is not changed.

Reduce SVG icon file size
Use Inkscape File -> clean up document functionality to remove SVG bloat.
This does not even remove all Inkscape specific metadata, but already
hugely reduces file size (and complexity).
before: 1.432.192 bytes, after: 633.535 bytes

It seems this function was previously called "Vacuum defs" in Inkscape,
and the savings we see are in large part due to removal of unused defs.

In some files it also changes the way paths are defined, but without
obvious visible changes.

The files still contain Inkscape metadata like the window size, version
and workspace position that could be removed without losing useful SVG
information.

Also note that for the file publicdomain/Information_icon.svg as well as
the layout_* files this process would actually increase file size as
Inkscape adds additional metadata. Hence that file is not changed.

@Kissaki Kissaki requested review from mkrautz and hacst Jan 31, 2017

@Kissaki

This comment has been minimized.

Copy link
Member Author

commented Jan 31, 2017

GitHub allows displaying the SVG side by side, which I checked for all icons. I also used the swipe on some of them to verify they are visually equal.

@Kissaki

This comment has been minimized.

Copy link
Member Author

commented Jan 31, 2017

This is intended to be a first step to reduce them in size, that does not require additional tooling or further analysis whether we lose anything valuable as discussed in #2017.

As the files still contain (a lot of) useless metadata I would expect we can still save a sizeable amount. That would be the next step/a follow up.

@Kissaki

This comment has been minimized.

Copy link
Member Author

commented Jan 31, 2017

I doubt this has noticable influence on performance though… 1MB is not that much anyway. But reducing the complexity still seems like a good idea.

@mkrautz

This comment has been minimized.

Copy link
Member

commented Jan 31, 2017

I haven't really reviewed in depth, but I worry that this might remove important metadata for editing. Are we sure it doesn't?

@Kissaki

This comment has been minimized.

Copy link
Member Author

commented Feb 1, 2017

What kind of data are you thinking about?

The SVG has a <defs> "head" section with definitions that can be used/referenced in multiple places by ID. This is used for example for gradient declarations, which is then used in the <path> content elements via ID style="fill:url(#radialGradient3708);.

Would there be any use case for editing the SVG and wanting to have gradients previously used when editing the file, which are not actually used in the current file/content/image though?

If we want to edit the image, we want to edit the current image, no?

The default_avatar.svg file has comparatively small changes and may be a good example to look at.

There’s an <inkscape:perspective> which I do not know what it is, but it is not used. If this were usable by Inkscape to reproduce the image we would want to keep it? Also if it is not Inkscape editable but reading the parameters of a perspective?

I mean, we can leave the bloated SVGs, but I would think if we were to edit them we would edit the current content. I won’t say I’m sure this is metadata of no use whatsoever, in inkscape or as parameters to reproduce these icons from fresh - maybe there’s Inkscape features or extensions I am not aware of. Personally, I would minify them, even to the point of the original PR. I do not see what we would edit if not the paths that are what makes out the content as it is.

@mkrautz
mkrautz approved these changes Feb 1, 2017
Copy link
Member

left a comment

Trusting your judgment on this one. :-)

@Kissaki Kissaki merged commit 6a9f491 into mumble-voip:master Feb 26, 2017

@Kissaki Kissaki deleted the Kissaki:svg-size branch Feb 26, 2017

@Kissaki Kissaki referenced this pull request Feb 28, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
2 participants
You can’t perform that action at this time.