Wow, this feels like the most efficient way I could possibly have ever learned how JPEG compression works. Well done!
Now I wonder how color channels are added.
Now I wonder how color channels are added.
Example of an image split into three planes: https://upload.wikimedia.org/wikipedia/commons/d/d9/Barns_gr...
Often the chroma planes are stored at a smaller resolution and scaled up when decoding, since details in chroma don't matter as much as details in brightness.
https://en.wikipedia.org/wiki/YCbCr#/media/File:CCD.png
It's almost always 4:2:0. Then you compress the chroma channels the same way as the luma.
[1]: https://en.wikipedia.org/wiki/Chroma_subsampling#Sampling_sy...
I was (maybe quite unusually for a CS degree at the time) taught about JPEG compression in 94/95; I've carried a sort of bare-minimum working knowledge of how it works along with me through web development and semi-pro photography, and it can be quite useful knowledge (e.g. when optimising "retina" images for the web).
But I'd have loved an interactive tool like this at the time, because it is not the easiest thing to absorb.