https://caniuse.com/#feat=svg-img
Isn't this generally expensive for browsers to render? And it doesn't guarantee correct rendering without access to the correct fonts...
No, it is not generally expensive. It depends. Here is a good article about measuring performance. As long as logo don't do any animations there is nothing to be afraid of.
https://jakearchibald.com/2013/solving-rendering-perf-puzzles/
For current Pagure page performance measurement shows that is jQuery calls are a bigger problem.
As for fonts, fonts need to be embedded - https://github.com/BTBurke/svg-embed-font - I will try to find if it is possible to do from Inkscape.
Embedding the fonts would make it bigger than a PNG. Don't get me wrong, I think the font should be embedded in the SVG, but the size it would be means that I'd rather not have it sent over the wire.
Without embedding I can not compare. Inkscape files contain enough excessive data, and gzip compression can make the size the same. Also, font subsetter helps to select only used glyphs.
https://oreillymedia.github.io/Using_SVG/extras/ch07-dataURI-fonts.html
Current SVGs need to be processed to embed fonts, and then we can see if size would be less than PNG, and with which subsets - full font, only English or only used glyphs,
In the meanwhile I filled the bug with Inkscape to make the process seamless -https://bugs.launchpad.net/inkscape/+bug/1810192
Honestly seeing the track record of SVG with regards to security issues, I much prefer we stick with png.
What would be the advantage of switching?
Security issues for project controlled SVG are the same as with project controlled Python. GitHub is not afraid to use SVG, Google uses them even inline, so why should everybody else afraid to do this?
The advantage of SVG is that it is scalable and can look well on desktop as well as mobile devices. It is also possible to audit SVG changes online, and using SVG directly reduces the hassle for people like me to submit design fixes, such as skewed logo on this site. The fix that started it all is still not there, because there are numerous issues that keep popping up. =)
There is no need to embed fonts here for the logos, we just need to convert the text to paths, and it works well. An optimized version of the pagure logo, with all the text converted to paths runs in at about 7kb.
@pingou the main benefit here is people with high DPI screens always get a crisp clean logo. We could ship a multiple PNGs at different resoltions, but it makes sense to me in the case of the logo to just go with SVG.
If we do convert these texts to paths, we should also keep around the original with the text in it too, so we have a version that is easily edited
i.e. keep the current SVG where it is, and change the .png in the static dir to the optimized SVG
@techtonik @ryanlerch ok I see the point and advantages. Let's go ahead.
@ryanlerch I'll let you do the rebase/merge dance once you consider this ready :)
Pretty ping?
My mind is occupied by a font-subsetter tool that can be used to save only needed glyphs, but preserve a the name of a whole font family.
It's been two months and this PR seems pretty stale, should we just close it or do we want to give it the final touches to get it in?
It has been a year since this PR was last commented on and it looks like we're still missing the final touches.
So I'm going to close this PR, please re-open it or open another one if you still want to push this forward :)
Pull-Request has been closed by pingou
https://caniuse.com/#feat=svg-img