My upload pipeline turned every screenshot into JPEG. The text got noisy and the files were bigger than PNG-8
My small tool site gets more screenshots than photos. For a long time the upload handler treated them all the same way: decode, re-encode as JPEG, store. Then a user sent me a screenshot of a chat log and asked why the text looked fuzzy after upload. I went back and measured, and the short version is that JPEG was the wrong call for screenshots twice over. The text picked up a ring of noise, and…
The author's upload pipeline consistently converted screenshots into JPEG format, resulting in noisy text and larger file sizes compared to PNG-8. This issue was discovered when a user reported fuzzy text in a chat screenshot. The author tested the pipeline using two custom screenshots: one with 174 distinct colors and another with 1,402 colors.
The JPEG encoding led to a 124 KB file for the text screenshot, while the 256-color PNG version was only 116 KB. The palette PNG size was even smaller at 58 KB, with no loss in pixel quality. The WebP format achieved near-PNG quality at a slightly smaller size. For the table screenshot, the palette PNG was 116 KB compared to 112 KB for the JPEG q80 encoding.
The author identified chroma subsampling as a factor contributing to the noise in colored text, but did not test a 4:4:4 JPEG for confirmation. Ultimately, the author opted for the palette PNG over WebP due to the lossiness of the latter and the need for legible screenshots. The author also considered switching to PNG entirely, but was deterred by the significantly larger file sizes.
The author devised a method to classify screenshots based on color concentration, using the share of pixels covered by the 16 most frequent colors. Screenshots with a dominant color concentration above 0.5 were converted to 256-color PNG, while the rest were encoded as JPEG with a quality of 80.
Written by urgent.news from Dev.to's reporting — not their text. Machine-written — may contain errors; check the original before relying on it.