PNG image optimization

[FazlyMR]

I'm currently working on optimizing PNG images used for the website by lossy (not the JPEG kind) means of converting each from RGB to indexed colors, and reducing it's total unique colors to 1/3 of the original since it's going to be downscaled by the browsers anyway to a lower resolution, thus interpolating the colors lost by that lossy optimization process.

As a trial, I managed to trim off a total of ~128 KBs (kilobytes) from all 6 images used in chapter 1.

This is a sample of one of them:

And this is the unoptimized version currently used:

Should I continue ahead and later submit a pull request for that?

[kognise]

I definitely want to optimize the images. Ideally this would be done automatically, however, perhaps with a script. Would you be interested in working on that?

[FazlyMR]

Hmm, sadly I don't really have any coding/scripting experience (and no idea where to start to make that script to automate it and find the equivalent tools that I use)...

The way I did it is manually using GIMP, to convert from RGB to indexed colors and reduce the colors used, and ZopfliPNG (as part of Zopfli) as a last process to optimize the resulting PNG file itself.

[kognise]

No problem at all! I will look into it and see what I can do to replicate that process.

[FazlyMR]

But in the meanwhile, would it be fine to submit a PR for my manual optimizations, which would still include the originals?

[FazlyMR]

No problem at all! I will look into it and see what I can do to replicate that process.

After some searching, I did found a library/CLI program called pngquant that did the same things that I did manually (I also realized that what I did is to quantize the colors, didn't know that terminology before or I just forgot). Not sure how to automate it though.

[kariyum]

ffmpeg is a great tool to consider. It is possible to make a bash script that will take a directory as an input that is full of images and produce another one with the same images but compressed. ffmpeg is known to be very useful in image compresseion and especially in video compression with very low/unnoticeable loss in quality.

[haneenmahd]

I definitely want to optimize the images. Ideally this would be done automatically, however, perhaps with a script. Would you be interested in working on that?

You can use imgbot GitHub app to automatically optimise the images for you.

See GitHub marketplace: https://github.com/marketplace/imgbot

[kognise]

imgbot is great but i don't think it does as much as @FazlyMR was doing manually! would definitely be down to write a script.

[haneenmahd]

I'm interested in writing that script this weekend. If you had any ideas in your mind earlier about optimising it, can you brief it?