[wojtek1942]

Hey HN,

I’m a CS student studying in Amsterdam. Usually, I like making native apps as side projects but here is a small web app for a change.

Recently, Google released Jpegli [1]. You might have seen their blog post posted here on HN ~1 month ago [2]. It’s a new JPEG coding library that can compress high-quality images 35% more than traditional JPEG codecs. When I searched for a tool to try this new technique, I was surprised to find nothing. That is why I created this website.

The encoder runs on WebAssembly making it possible to do all the image processing in the browser. This allows for fast results and optimal privacy since images are never sent to my server or anything like that.

Please let me know what you think or if you have any questions!

[1] https://opensource.googleblog.com/2024/04/introducing-jpegli...

[2] https://news.ycombinator.com/item?id=39920644

[niutech]

Cool, thanks! Could you elaborate on advanced options? How does basic progressive rendering differ from enhanced? How many scans do they provide? How does the first scan look like? How much does DCT method affect compression and quality? What's the difference between slow & fast integer? Where is the option to use JPEG XL's XYB colorspace (ICC profile)?

[wojtek1942]

It took a bit of time for me to respond because I wanted to make sure I wrote down the info in a nice detailed way. I will update the descriptions on the website to include the information I am proving here to give visitors a better understanding of the options. To be clear, I am not an expert on all this image coding stuff. I just wanted to make a simple tool to let people try out Jpegli because I thought it was interesting even though I don't know so much about the topic.

Progressive Rendering There are 3 options on the website. None, Basic and Enhanced. There correspond respectively to options 0, 1 and 2 for the JXL_ENC_FRAME_SETTING_PROGRESSIVE_DC option [1].

"Set the progressive mode using lower-resolution DC images for VarDCT. Use -1 for the encoder default, 0 to disable, 1 to have an extra 64x64 lower resolution pass, 2 to have a 512x512 and 64x64 lower resolution pass."

So "Basic" provides 1 scan and "Enhanced" provides 2 scans. Here is a detailed description on progressive loading: https://www.thewebmaster.com/progressive-jpegs/

DCT Method I can't really find documentation about DTC Method in libjxl but the options seems to be very similar to the options offered in mozjpeg [2]. They have a detailed explanation on that page I referenced which I won't all copy here. Seems like slow integer is the preferred method as the others are marked as legacy. Maybe I should just remove the options? From my testing the slow integer method has slightly worse compression but it is accurate.

XYB colorspace TBH, the library I am using only supports a few color spaces and it does not include XYB and I have not looked into it much further. Also as you can see I did not really bother to add colorspace settings in general but I might do it later.

[1] https://libjxl.readthedocs.io/en/latest/api_encoder.html#_CP...

[2] https://github.com/mozilla/mozjpeg/blob/6c9f0897afa1c2738d72...