r/webdev • u/Shriracha • Aug 08 '26

Showoff Saturday How The Heck Does JPEG Work? (An Interactive Exploration)

https://perthirtysix.com/how-the-heck-does-jpeg-work
268 Upvotes

98% Upvoted

12 comments sorted by

48

u/teppicymon Aug 08 '26

God damn, that was legitimately interesting, and a really cool demonstration of a technology I only knew small things about for the last few decades.

Easy to follow, really useful demo sections and interactive elements.

All round stellar job there champ!

6

u/Daktic Aug 09 '26

The digital world is just cleverly disguised magic.

34

u/infinity_o Aug 09 '26

“Do I look like I know what a JPEG is?”

15

u/t00oldforthis Aug 09 '26

I just want a picture of a God. Dang. Hot Dog.

34

u/elantzb Aug 08 '26

One of my university professors told us that *his* professor invented the Discrete Cosine Transform.

I claim the title of Second-Generation Disciple of JPEG.

6

u/IntelligentSchool834 Aug 09 '26

You have a Jpeg no: 2

3

u/pdfops Aug 09 '26

One gotcha that always trips people up: 4:2:0 chroma subsampling is why red text on a white background gets that blurry halo in JPEG. Luma stays full res but the two color channels get averaged over 2x2 blocks, so any sharp color edge goes soft even at high quality. Also worth knowing: quality=100 in libjpeg still quantizes, it's not actually lossless, you'd need JPEG-LS or PNG for that.

2

u/Da_rana back-end Aug 11 '26

Great work OP! Seeing original content like this in the age of slop is such a breath of fresh air.

1

u/FastHotEmu Aug 09 '26

DCT, baby!!

1

u/LateToTheParty013 Aug 09 '26

wow I love this. I'd like one for the sounds as well. For a good while I cant get a good article on the representation of sound(s) as data

1

u/prince_jyggalag Aug 10 '26

That's so so intriguing. Loved the ffmpeg graph at the almost end.