Reduce palette - alpha only

[jakearchibald]

WebP and JPEG-XL encode alpha data 'losslessly'. I'm not 100% sure with JPEG-XL, but WebP's compression benefits from palette reduction.

It'd be good to add a toggle to palette reduction that makes it only act on the alpha channel of the image.

[jakearchibald]

This can reuse the current palette reducer, but before it's called, create a copy of the image and set all the RGBs to a single color. Then apply the alpha channel of the result back to the original image.

[Csabesz07]

Hi! Is this still in game? I'd like to pick it up if possible.

[surma]

Yeah absolutely! It should probably be added as a new option to the ImageQuant codec. If you wanted to take a stab at that, I’d be happy to review a draft PR.

[jakearchibald]

Agreed. An "alpha only" toggle on "Reduce palette". Implementation-wise, create a single-color version of the image with alpha preserved, pass it through imagequant, then apply the alpha of that result back to the input image.

[Csabesz07]

I'll make a draft PR as soon as possible, thank you for the hints, I'll keep those in sight.

[Csabesz07]

Hi!

I was finally able to start working on it yesterday, but I'm having a tough time setting up the project. Based on the README it should be 3 easy steps right? (Sorry if I missed anything) I installed node modules without any trouble, but than the problems begun.

I was using node version 18.14.2, and when I run npm run build I get this error:

[!] (plugin css) Error: Could not load css:/Projects/squoosh/src/shared/prerendered-app/colors.css (imported by initialCss): Cannot find \Projects\squoosh\src\shared\prerendered-app\colors.css in pathToResult Error: Could not load css:/Projects/squoosh/src/shared/prerendered-app/colors.css (imported by initialCss): Cannot find \Projects\squoosh\src\shared\prerendered-app\colors.css in pathToResult at Object.load (N:\Projects\squoosh\rollup.config.js:552:17) at N:\Projects\squoosh\node_modules\rollup\dist\shared\rollup.js:18971:25

Okay no problem, after a little bit of searching I found this issue: #1204
It says that with node version 14 there should be no problem, and it really worked with 14.21.3

Next step is npm run dev. I had some issues which I think is related to windows, because some commands here were not recognised couse I had this error message:

[email protected] dev
DEV_PORT="${DEV_PORT:=5000}" run-p watch serve
DEV_PORT' is not recognized as an internal or external command, operable program or batch file.

So I overwrote the command manually and ended up with this:

set DEV_PORT=5000
npm run watch & npm run serve`

Watch runs fine, finds 0 errors, but hosting a dev server fails on multiple errors.
Firstly it couldn't find --listen=$DEV_PORT (Even tho it was there, but the value was always null)
ERROR: Unknown --listen endpoint scheme (protocol): null

dev would run this command: serve --listen=$DEV_PORT --config ../../../serve.json .tmp/build/static
I had to add "ng" in front of serve to get his working, but now it says that in order for Angular CLI to work I need at least node version 16. Okay, switching back to node version 18 useing NVM. But now it says

Error: This command is not available when running the Angular CLI outside a workspace.

Do you know anything about these errors? If you need any details please let me know. I'm sorry if anything of this is my bad, i'm new to github and this will be my very first open-source project contribution.

Thanks in advance!

[surma]

You are right, it should be 3 simple steps. On Node 20.8 on a Mac, the following sequence works for me on a fresh clone:

$ npm i
$ npm run build
$ npm run dev

So, definitely don’t downgrade Node. Node 18 is almost end-of-life, so I’d rather go the other way towards Node 20.

Don’t use ng serve or anything. That’s Angular tooling and this is not an Angular app.

Are you using WSL? Because if not that might be the cause of these errors. I am not sure that we ever tried to make Squoosh dev server work in Powershell.

[Csabesz07]

Yes, you were absolutely right! Using WSL and node version 20.8 solved all the errors I mentioned above. Thank you for your help.

[Csabesz07]

Hi! @surma @jakearchibald
I'm sorry for this taking so long. I only had the time to start working on it this monday, but i finally finished. I created a draft PR (#1401 )
You were right, WebP does benefit a lot (additional 10% avr.) from this option, not like JPEG-XL (additional 1% avr.).