How to make small indexed png8 files?

[krismach]

I'm trying to make small indexed png8 files, but they usually end up being larger than png24.

For example, I'm working on an image that I've only applied unsharpen mask filter using the same settings and in affinity photo, the size is almost always larger than png24.

I've tested with photoshop and gimp, and I don't experience it there. So I must be doing something wrong or missing some step. Here are my results for same file and same unsharpen mask settings. For png8 I'm using 128 colors:

photoshop png24: 41.2kb
photoshop png8: 13.8kb

gimp png24: 37.4kb
gimp png8: 12.2kb

affinity png24: 42.2kb
affinity png8: 61kb

If I posterize to 128 colors and save default png8 I get it down to 38.9kb.
If I change the default png8 paletize from 256 to 128 colors it goes up to 64.8kb.

So basically I can't create a smaller png8 file than the png24 in affinity if I apply a filter.

Without unsharpen mask, it will save to comparable 13kb (but only if using default png8, if you change paletize from 256 to 128, it will be larger than full png24.)
 

[NotMyFault]

Welcome to the forum.

any chance you can add an example file, and screenshot of the exact export settings used ?
Adding sharpening filters will introduce lots of “additional” colors to the file. If you want small files, you should try to reduce the number of colors, and have smooth areas of identical colors. Sharpening is the natural enemy of small files (for compressed formats).

On the other side, i cannot rule out a possible bug or missing feature on Affinity side.

But probably it is more a design choice what colors to prioritize (keep) and what to remove. Palletizing is an aggressively lossy type of compression.

I tried some test exports using Affinity and an online service to create png-8 from the same source image. While the images look visually identical, there are minor color differences on pixel level, and in file size.

[krismach]

It definitely could be adding shades of colors, but wouldn't that be the same issue in PS and Gimp? Also since the 24bit png could have millions of colors while png-8 could have max of 256 colors it should typically be smaller.

This also seems to happens with gif in Affinity. But doesn't happen in PS or Gimp.

Here is default PNG Export from Affinity:

And here is default PNG-8 Export from Affinity:

Here is PS PNG-24 Export:

And here is PS PNG-8 Export:

[NotMyFault]

Thanks for the screenshots.

Can you upload the source file (as affinity afphoto)?

PS and Affinity differ in what algorithms or low level functions are used, could give different results in edge cases - like here.

[krismach]

Here is the file.

Thanks for looking at it.

test.afphoto

[NotMyFault]

What I can see is that photo creates a lot of dithering when using palletised export.

we know that Affinity tends to use forced dithering in other situations e.g. for gradients, and doesn't offer a regular way to deactivate it in case of unwanted.

Original before export:

This might explain why it uses more storage.

 

If you compare this (zoomed in 10x at least) to PS export, is that a bit smoother?

 

I assume Affinity wants to provide a smoother visual rendering by dithering, but this leads to bigger files in this specific case.

So the way to avoid would be using a "cleaner" file. The file contains lots of anti-aliasing artifacts and sharpening lead to halos / overshooting colors (across the light coloured lines). I'm sure the original file contained only 3-5 colors (blue, green, white, maybe some shades in between), and would compress like nothing. The pixelisation caused lots of sartiufacts, breaking the compression / palettes algorithm.

 

[krismach]

That explains it.

Yes the Photoshop png-8 file is totally smooth. Unsharpen mask nor dithering added any unwanted artifacts.

Here it is zoomed in:


And here is the full as exported from PS:

[NotMyFault]

Seems to be a design choice by Affinity to

• enforce dithering for all palletised exports
• using "posterise" for palette creation even in cases where the number of used colors is so low that no extra posterisation (Edit: I hate the auto correction which gave: pasteurisation) required (leading to avoidable dithering, and consequently bloating png sizes making the whole process useless)
• the at some time intended use of custom palettes never got implemented for >5 years now

 

[Alfred]

7 minutes ago, NotMyFault said:

no extra pasteurisation required

You know I’m going to milk that typo for all it’s worth, don’t you!

[h_d]

4 hours ago, Alfred said:

You know I’m going to milk that typo for all it’s worth, don’t you!

You've got some bottle.

[NotMyFault]

51 minutes ago, BofG said:

It was a while since I used it, so this could be wrong, but when you click "more" on the PNG 8 export don't you then have control over how many colours it includes?

yes. 

[R C-R]

3 hours ago, BofG said:

It was a while since I used it, so this could be wrong, but when you click "more" on the PNG 8 export don't you then have control over how many colours it includes?

On my Mac, there is a PNG-8 (dithered) preset. If I choose it & click More, I get a Palletized option that must remain checked for the export to be outputted in PNG 8 format. To get any choice of colors the Palette option must be set to Automatic & that enables the Colors popup with the only choices being 256, 128, 64, 32, 16, 8, 4, & 2. There is no way to control which specific colors will be used with the Automatic setting, or with any of the other Palette choices (the colors field is greyed out).

[krismach]

I tried comparing at different color palettes:

PS 256: 16KB
Affinity 256: 70KB

PS 128: 12KB
Affinity 128: 60KB

PS 64: 11KB
Affinity 64: 55KB

PS 32: 9KB
Affinity 32: 54KB

PS 16: 6KB
Affinity 16: 32KB

PS 8: 6KB
Affinity 8: 23KB

PS 4: 5KB
Affinity 4: 7KB

PS 2: 2.48KB
Affinity 2: 1.89KB

The acceptable quality for this image is 128 down to 32. And those are the sizes that Affinity for some reason fails to produce good small sizes.

 

[NotMyFault]

For those who missed the main finding in this thread: 

Affinity applies forced dithering (the palletised export is call PNG-8 (dither) for a reason), even if this isn‘t required or wanted at all.

PS avoids dithering, giving you better results and far smaller file sizes (in those cases where it matters). It chooses the colors for the palettes so that dithering is not required at all. Affinity never implemented this function (despite the menu contains a non working „custom“ choice, so it was planned originally).
 

Dithering has a negative impact to compression.

[lacerto]

19 hours ago, NotMyFault said:

It chooses the colors for the palettes so that dithering is not required at all.

Furthermore: it allows the user to decide the exact amount of colors to be used at maximum, and which kind of dithering algorithm is used (if used at all), to what extent it is used (by percentage) and how the colors to be used are chosen (e.g. adaptively with perceptual similarity), and whether a predefined palette or other forced colors should be used or included. The feature is used both for technical and aesthetic reasons and is an important part of a professional raster image editor, not "just" a legacy feature that "old" apps that date from the time when there were only paletted images (like Photoshop, Corel PHOTO-PAINT and GIMP) drag along. If the feature is implemented at all, it should be implemented with a thought, not just offered as a kind of a sloppy afterthought to get some additional check marks in comparative feature lists.

 

[Fixx]

AP uses also automatic palette, which is optimized for image colours. There is no way around dithering though if here is anything in he image that can be dithered. Simple clear shapes should not dither (though sometimes they do in AP).

I tested simple 600X800 pixels 2 colour image which has left side green and right size red. PS compressed it to 1 891 bytes. AP compressed the same image to 611 bytes. PS had 2 colour palette, in AP 2 colour palette did not work (got grey image) so I used 4 colours.

Are you sure you did choose NOT to include colour profile AND metadata?

[lacerto]

17 hours ago, Fixx said:

Simple clear shapes should not dither (though sometimes they do in AP)

I think it is related to an image initially having more than 256 colors (like the test image provided by OP). APhoto uses at least 8 different colors for that blue area that when using flood select with non-antialising and 0 tolerance shows a clear shape in large areas. When I tested APhoto with a rainbow with 32 non-dithered colors done by PS and saved the same image in APhoto, it did not create any dither artifacts but basically produced an unaltered image.

It seems PS cannot save without meta data, so that explains the difference in these kinds of minimal images. But the difference with the OP's image that I got was 8,600 bytes (PS) vs. 54,835 bytes (APhoto).

EDIT: No, I was wrong, the number of initial colors does not seem to have effect on this. I now tested with OP's image that PS first had quantized into a 32-color non-dithered image. When this image was opened in APhoto and saved as 8-bit PNG, and specifying the number of colors (to 32, basically to trying to keep it same), APhoto still used 4 colors for that blue area, that now was completely clear. But I then re-exported leaving colors to default "256", and this time it did it correctly and produced a 9K image with no dithering artifacts, so basically the same image that was opened. So there is clearly a bug in color reduction method and obviously best results can be achieved simply by leaving the setting to 256 colors. ("Palette" option needs to be "Automatic").  That, however, does not work with an image that does have > 256 colors initially so 247 colors were actuallly used with "256" color settings, and as mentioned, at least 8 colors used to dither the clear blue shape without any cause. 

[NotMyFault]

1 hour ago, Fixx said:

AP uses also automatic palette, which is optimized for image colours. There is no way around dithering though if here is anything in he image that can be dithered. Simple clear shapes should not dither (though sometimes they do in AP).

I tested simple 600X800 pixels 2 colour image which has left side green and right size red. PS compressed it to 1 891 bytes. AP compressed the same image to 611 bytes. PS had 2 colour palette, in AP 2 colour palette did not work (got grey image) so I used 4 colours.

Are you sure you did choose NOT to include colour profile AND metadata?

Your example is a totally different case (2 or 4 colors), in in that case AP might give better result. 

The OP asked for 128 colors, and there Affinity strugles.

 

[Fixx]

With 128 colours he problems seems to be dithering. AP could no use simple flat 128 colours but added dither anyway.

I would not use Affinity for any colour reduction work.