Upng.js: 使用抖动

创建于 2018-03-27 · 5评论 · 资料来源: photopea/UPNG.js

这对于彩色图像很重要。

源图像 [174285 B]
firefox-512

upng后，网页界面 [69927 B]
firefox-512 upng

pngquant 的结果看起来更好。 [69932 乙]
firefox-512 pngquant

资料来源

Ser-Gen

最有用的评论

是的，pngquant 计算均方误差，并且仅在高误差区域应用抖动。这样不需要抖动的区域就不会产生额外的噪音。

pngquant 还进行边缘检测（类似于 Prewitt 算法）并禁用边缘抖动。这可以防止抗锯齿看起来像毛皮。

在 pngquant 中，90% 的时间都花在额外运行的 K 均值上。如果您使用--speed 10整个重新压缩（在 i7 2.3Ghz 上）大约需要 80 毫秒抖动，50 毫秒未抖动。

（顺便说一句，TinyPNG 没有自己的算法。它只是 pngquant 的一个 GUI）。

kornelski 于 2018-03-29

❤3

我过去实施了 Floyd-Steinberg 抖动，但不值得。

我认为我们需要一些压缩友好的抖动。你认识可以帮助我们的人吗？

photopea 于 2018-03-27

pngquant 使用经过改进的 Floyd-Steinberg 以实现更好的颜色处理。

我相信，由于其随机性，抖动总是会增加文件大小。
此功能的唯一目的 - 取悦我们的眼睛。
抖动可以隐藏在标志下，就像在 Ps 中一样。用户将决定。

我认为我们需要一些压缩友好的抖动。你认识可以帮助我们的人吗？

我想，我们可以问@kornelski。

Ser-Gen 于 2018-03-27

我的意思是，我制作了三个版本的图像：

B 看起来和 C 一样漂亮，但稍大一些，所以我认为允许更多颜色比抖动更好（两者都会增加文件大小）。

我认为我们需要抖动，它由一些重复的模式组成，即它应该对 Deflate 算法“友好” - 使 B 只有 20 kB（所以它仍然和 C 一样好，但更小）。

顺便提一句。我还认为，pngquant 执行更好的 Deflate（它也比 UPNG.js 花费大约 100 倍的时间：例如 30ms 与 3000ms），因此它可以使 B 只有 20 kB，同时使用与我相同的抖动。

photopea 于 2018-03-27

原来如此。
我不知道可以处理这种情况的抖动算法。

pngquant 计算 mse 误差，具有最小和最大质量设置，如果文件的大小太大或质量急剧下降，则不要写入文件。