JPG vs BMP vs PNG vs GIF

This was a quick experiment I did to check the efficiency of a few image formats. For this experiment I base64 encoded a 1 pixel image file of each of the following image file formats: .jpg, .bmp, .png, .gif.

Here is the base64 encoded results of each image:

.jpg - From a 539 byte file
/9j/4AAQSkZJRgABAQEASABIAAD//gATQ3JlYXRlZCB3aXRoIEdJTVD/2wBDAAEBAQEBAQEBA
QEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQE
BAQEBAQEBAQH/2wBDAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBA
QEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQH/wgARCAABAAEDAREAAhEB
AxEB/8QAFAABAAAAAAAAAAAAAAAAAAAACf/EABQBAQAAAAAAAAAAAAAAAAAAAAD/2gA
MAwEAAhADEAAAAX8P/8QAFBABAAAAAAAAAAAAAAAAAAAAAP/aAAgBAQABBQJ//8QAFB
EBAAAAAAAAAAAAAAAAAAAAAP/aAAgBAwEBPwF//8QAFBEBAAAAAAAAAAAAAAAAAAAAA
P/aAAgBAgEBPwF//8QAFBABAAAAAAAAAAAAAAAAAAAAAP/aAAgBAQAGPwJ//8QAFBABAA
AAAAAAAAAAAAAAAAAAAP/aAAgBAQABPyF//9oADAMBAAIAAwAAABAf/8QAFBEBAAAAAAA
AAAAAAAAAAAAAAP/aAAgBAwEBPxB//8QAFBEBAAAAAAAAAAAAAAAAAAAAAP/aAAgBAgE
BPxB//8QAFBABAAAAAAAAAAAAAAAAAAAAAP/aAAgBAQABPxB//9k=

.bmp - From a 126 byte file
Qk1+AAAAAAAAAHoAAABsAAAAAQAAAAEAAAABABgAAAAAAAQAAAATCwAAEwsAAAAAA
AAAAAAAQkdScwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAIAAAAAAAAAAAAAAAAAAAD///8A

.png - From a 69 byte file
iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAADElEQVQI12P4//8/AAX+Av
7czFnnAAAAAElFTkSuQmCC

.gif - From a 35 byte file
R0lGODdhAQABAIAAAP///////ywAAAAAAQABAAACAkQBADs=

Based on these results it is clear that a 1 pixel gif image is the most efficient format for base64 encoding data.

Update:
I conducted a further study of the efficiency of these image formats by generating a series of images of each type ranging from 1 pixel to 2000 pixels and skipping by increments of 200. To make the testing go quicker, I created a script in Python that generates a set of images and logs their file size and dimensions. My script also generates a graph based on these logs to help visualize the data.
If your interested seeing the code or generating the logs for yourself you can download the script from https://gist.github.com/gunthercox/9874531.

For this graph, the horizontal axis is the physical dimensions of the file, and the vertical axis is the file size.
.jpeg = red
.bmp = black
.png = green
.gif = blue

The data from the logs shows that the png to be on average the most efficient format. Jpegs and gifs have very close performance for smaller images but jpegs quickly increase in size for larger images. Bitmap images (.bmp) were surprisingly inefficient and while all these formats had very close sizes for a 1 pixel image file, the bmp image grew tremendously larger as the size of the file was increased.

3 comments:

  1. shimniok3/24/2014

    Before making that broad conclusion I would want to see a variety of different, typical sorts of images of varying sizes. Compressed images are at a distinct disadvantage when only encoding a single pixel. Give them a million and then what?

    ReplyDelete
  2. Definitely agree. The next step would be to compare size of the files as the number of pixels is increased. I might write up a python script to test this.

    ReplyDelete
  3. I updated the post with some additional testing that I did. It defiantly

    ReplyDelete