Please stop using jpg when you should be using png | Hacker News Reader

Please stop using jpg when you should be using png

8 pointsSQL221914 comments

Is it just me, or does this bug anyone else? I see way too many charts and screenshots as jpg images.

This to me is a totally pointless post. It contains only a rant. There is no information of any use to anyone who does not know the differences between the file types, nor does it provide any use cases for when you should use them. It feels like a totally pointless, self-satisfying post.

I would try to explain why this person is frustrated, but there is nothing that tells me exactly why they are. Is it because the charts contain transparency or gradient fades? Is it because they are saving them out as .jpeg and thus having a larger filsize than the .png equivalent? Or is it because they are mostly flat coloured and so .png might handle that better? I have no idea...

For those interested and keen for a little foray into the different file types, check these and ignore this pointless post, just let it fall away:

http://www.whoishostingthis.com/blog/2014/12/06/jpeg-gif-png...

http://www.scantips.com/basics09.html

Tangent: please use progressive jpegs when appropriate. That is image backgrounds, images necessary for navigation etc. Or actually, when in doubt just go progressive.

And please stop using PNG when you should be using JPG.

Unless you're building a site where the primary focus is the photography, use a high quality JPG instead of PNG for photos, the file size increase with PNG usually isn't worth it.

Please use svg and stop wasting bandwidth.

SVG with lots of elements can often be larger than a even a pretty high resolution PNG. Happens to me often when exporting graphs with thousands of data points.

Since SVG is text, it will usually be compressed well below the file size before hitting the wire, though.

I don't know if anybody else has this problem, but sometimes SVG are just really slow to render for me, especially on cell phones and other constrained platforms.

I also see other rendering artifacts, such as re-rendering flashes, depending on how it's being used. However, it is text and should be used.

SVG can also be treated as a DOM and can be partially updated...or restyled with CSS.

I always use PNG even when it makes larger files.

That habit goes back to my experience in professional photography where top quality is paramount and "lossy" is a 4-letter word.

really, why should i prefer to use png?

Because of sharp edges where edges should be sharp. JPEG compression doesn't allow it by its very nature.

Actually, with a quality parameter at 100%, JPEG doesn't fail as spectacularly as you probably have in mind.

The compression artefacts I think you are thinking of are likely the result of someone not setting the quality parameter appropriately. For text or charts, you're best off at 100%, but you can easily get away with lower values for most photographs. Granted, not an issue with PNG, but JPEG isn't so bad when used properly. (and typically does have huge file size benefits)

For text/charts, a JPEG set at 100% is 2-4 times the size of a PNG and approaches lossless quality, but still isn't.

Reply on news.ycombinator.com