17

I see JPG images everywhere. But why?

PNG files have opacity, while JPGs do not. I've tried exporting some images to PNG and JPG to compare size, and they both either match up or the PNG is smaller(depending on the image of course).

enter image description here

This is a 512x512 JPG image that says "JPG"

enter image description here

And this is a 512x512 PNG image that says "PNG".

The JPG was 31.7kb and the PNG was 25.9kb

So what gives?

  • 3
    Something you should also know is that .png is lossless, while .jpg isn't. So .png are more suited to source-images, while .jpg is more suited to publication. – Nobody Jun 5 '15 at 20:24
  • 1
    @Nobody PNG can be lossy or lossless. Depending on how you export it. – DA01 Jun 5 '15 at 22:41
  • 8
    FYI, you rarely would use JPG for line art, like the examples you use here. So based purely on these examples, you wouldn't use JPG. If these were photos, though, you'll realize you get entirely different results. – DA01 Jun 5 '15 at 22:42
  • 7
    I seriously can't believe this question survived more than 10 seconds. – plainclothes Jun 5 '15 at 23:44
  • 2
    @DA01 PNG is never lossy, but you can lossfully manipulate the image before exporting it to PNG to make it smaller. The PNG specification know nothings about this. – Nobody Jun 6 '15 at 7:58
35

Because they are way better at compressing pictures that have lots of colours and irregular shapes, like photographs.

Have you tried the same epxeriment you did, but then with a photograph? The .png is most probably going to be noticeably bigger than any .jpg, regardless of the .jpg's compression factor.

Example:

png picture
.png picture, 110k

jpeg at 100 quality
.jpg at 100% quality, 63k

jpeg at 30 quality
.jpg at 30% quality, a measly 9k

If you look closely, you will see some artefacts on the 30% quality .jpg, but that's mostly because the hard edge of the lightbulb against the smooth green background doesn't lend itself too well to the compression algorithm. You can have regular pictures reduced to even 10 or 5% quality without any loss you'd notice at a glance.

  • 3
    FWIW: After optimizing the PNG it has 34 KB without any recognizable loss. – Mario Jun 5 '15 at 14:29
  • Wow, I never knew that. I tried converting a photograph I took to PNG and it went from 550k to 2933k. Do you know what makes that the case? – JediBurrell Jun 5 '15 at 14:31
  • 10
    @JediBurrell PNG compression is always lossless (AFAIK), whereas JPG's compression will eventually drop image information. In your case, an already JPG compressed albeit good-looking image will contain edges around each bucket (compressed little squares that make up a JPG image), and PNG picks these artefacts up so that they are not lost. Hence, your PNG is much larger than your original JPG. Re-compressing a JPG using JPG will make this worse many times over - the effect is called "meta blocking". – Jay Versluis Jun 5 '15 at 15:15
  • 2
    @JediBurrell If you are interested in the technical and mathematical details you can watch this video by Computerphile. – Paul Manta Jun 5 '15 at 15:54
  • 2
    "the smooth green background doesn't lend itself too well to the compression algorithm": It's the opposite, gradients are very well represented by JPEG, while hard edges aren't, producing artifacts nearby. For the curious, read about Fourier transforming a square signal. – Lloeki Jun 6 '15 at 8:49
13

JPEG has backing from the photographic industry and predates PNG by a half-dozen years or so, while PNG was designed as a replacement for GIF, which was rather zealously protected by CompuServe. People were sued for using GIFs on their websites, for example, simply because they didn't use a program that was licensed by CompuServe to make those images.

From the beginning, JPEG was designed to recover some space by making files smaller, at the expense of pixel-perfect quality. Even setting Q to 100 will cause minor, mostly invisible artifacts-- the damage is done, and each additional time the file is modified and saved, further damage will occur. However, unless you do so many times, you'll probably never notice the effect unless you go looking for it.

PNG, on the otherhand, is perfectly lossless. Every pixel is faithfully reproduced every time, no matter how many times the file is modified and saved. There's a limit to how well you can compress data without loss, however, although PNG employs several tricks to pack as much information into as few bytes of data as possible. A high quality JPEG will probably be about the same size a PNG without optimization or even larger. As PNG begins to optimize, say, by using filters or adjusting window sizes, the file becomes smaller without loss, while JPEG must start discarding visual information to keep up.

So, why is JPEG used? It is, after all, generally inferior in terms of fidelity and storage space. The main reason, of course, is that it is an industry standard and has very broad support. Virtually every camera in the world uses either RAW (literally, the raw data), or JPEG. There are hardware data processors built-in to those cameras to compress the JPEG data as fast as possible, etc.

You'll find this is the same reason why GIF is everywhere still. Most software supports GIF, while PNG enjoys lesser support in older software (e.g. older Internet Explorer versions required a plugin to show PNG files). Even though it has lousy color support, it does support animations, something PNG does not do (there is a related file format, APNG, that never quite took off the way PNG did). GIF still remains the champion of animated images, as it is the only file format that can do so with widespread support.

The cost to change from JPEG to PNG would be prohibitive from a hardware prospective. Cameras would need new processors built to support fast PNG compression, for example, because they're hard-coded to use JPEG right now. Your old cameras would be worthless, because you'd have to buy a new one with a PNG chip built-in. That would also mean you'd have to convince a manufacturer to go against industry standards and start manufacturing such devices, which means there'd have to be enough demand to justify it, and such cameras would initially be more expensive than their JPEG-based counterparts. It's very difficult to change an industry.

  • PNG is potentially lossless. The saving software may choose to lose data tough for better compressable format. The vavelet nature of jpeg makes it impossible for it to be lossless. – joojaa Jun 5 '15 at 21:51
  • @joojaa Can you back up the statement that PNG compression "may choose to lose tough data"? – CJ Dennis Jun 6 '15 at 1:18
  • @joojaa JPEG uses DCT compression, not wavelet. You might be thinking of JPEG 2000. – bcrist Jun 6 '15 at 2:30
  • 7
    It's my understanding that colour reduction happens before the image is passed to the PNG codec. Just because a format is capable of storing already lossy data doesn't make it lossy. Changing a 32-bit RGB with Alpha image to a 1-bit black & white image will lose a lot of data but it's not PNG that's doing that. Colour depth reduction is a lossy conversion, not lossy compression. – CJ Dennis Jun 6 '15 at 3:21
  • 2
    My mistake DCT it is. My point is that while PNG is lossless not all PNG optimizers are! Thus without knowing what you did use you dont know if the process was lossy or not. So the question about nonlossyness is not as simple as one thinks. Just like color depth changes happen before saving PNG optimizers might alter images in other ways before saving, for smaller footprint. @JCDennis These crunchers exist just see their manualnpages. – joojaa Jun 6 '15 at 4:46
7

Something not mentioned in great detail is the way these compression algorithms work. JPEG is targeted directly at photographs where slight changes in pixel color are not noticed. PNG is targeted more for fabricated images that contain large areas of a single color where is compression is taken full advantage of like in your example of a huge all white photo with plain black lettering. If you took same photo and put the white background to fade from white to gray evenly across the image side to side the png size would drastically increase and jpg would probably have little change. I did some coding about 10 years ago directly with both of these formats to decompress these file types into bmps. JPEG is very sophisticated and complex. PNG is very simple and only really effective on certain pictures where color is unchanging in horizontal lines

  • 1
    Have you actually tried this? PNG is not simply run length encoding and is far more sophisticated than you suggest. It uses an adaptive algorithm and will effectively compress both solid areas and repeated patterns. – z7sg Ѫ Aug 19 '16 at 16:52

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.