4 ms·

This JPGs-in-a-SVG thing is grotesque, an example of how web development often seems like a Jenga tower of hacks. Why not find minimally-perceptible pixel chang

This JPGs-in-a-SVG thing is grotesque, an example of how web development often seems like a Jenga tower of hacks. Why not find minimally-perceptible pixel changes to the image that allow it to compress better as PNG?

scrollaway 6y ago
> Why not find minimally-perceptible pixel changes to the image that allow it to compress better as PNG? I would bet a whole pizza, anchovies included, that you'd be the first one to fire an engineer who wasted his time pixel-perfecting a random PNG on your homepage under the guise of performance, when this is actually an alternative. The JPG-in-SVG is a beautiful hack to work around Apple's former refusal to support WebP. You can just use WebP if you are okay giving older iOS/macOS users the finger. This isn't web dev being "hacky", it's Apple being shitty. Hasn't HN always celebrated such hacks?
- wizzwizz4 6y ago
  Just write a program to do the pixel-perfecting.
  - scrollaway 6y ago
    Now that's a thought. (OptiPNG exists, btw: http://optipng.sourceforge.net/ http://optipng.sourceforge.net/) The fact is, if you know how JPG and PNG work, you'll know that a colorful and busy image like the one linked in the article, with lots of varying alpha colors and values for anti-aliasing, is basically impossible to compress anywhere close to a JPG. There are more lossy ways to compress PNG which aren't done automatically anywhere to my knowledge, such as reducing the amount of colors to fit a smaller color space. What you can also do is turn the image into contiguous chunks so that they are in a pattern that is more compressib… wait, we're just reinventing JPG aren't we.
enlyth 6y ago
PNG is lossless while JPG is lossy so I'm not sure how you'd want to do this.
- banana_giraffe 6y ago
  There are a few lossy transformations you can make to an image before saving it as a PNG that result in a lossy compressed PNG that's smaller than the image otherwise would be. This idea was used a ton with GIFs, it's less popular with PNGs, though. pngquant is one tool I know of that does this. That said, I have no clue if such techniques would result in a smaller image than this approach.

scrollaway 6y ago

> Why not find minimally-perceptible pixel changes to the image that allow it to compress better as PNG? I would bet a whole pizza, anchovies included, that you'd be the first one to fire an engineer who wasted his time pixel-perfecting a random PNG on your homepage under the guise of performance, when this is actually an alternative. The JPG-in-SVG is a beautiful hack to work around Apple's former refusal to support WebP. You can just use WebP if you are okay giving older iOS/macOS users the finger. This isn't web dev being "hacky", it's Apple being shitty. Hasn't HN always celebrated such hacks?

wizzwizz4 6y ago
Just write a program to do the pixel-perfecting.
- scrollaway 6y ago
  Now that's a thought. (OptiPNG exists, btw: http://optipng.sourceforge.net/ http://optipng.sourceforge.net/) The fact is, if you know how JPG and PNG work, you'll know that a colorful and busy image like the one linked in the article, with lots of varying alpha colors and values for anti-aliasing, is basically impossible to compress anywhere close to a JPG. There are more lossy ways to compress PNG which aren't done automatically anywhere to my knowledge, such as reducing the amount of colors to fit a smaller color space. What you can also do is turn the image into contiguous chunks so that they are in a pattern that is more compressib… wait, we're just reinventing JPG aren't we.

enlyth 6y ago

PNG is lossless while JPG is lossy so I'm not sure how you'd want to do this.

banana_giraffe 6y ago
There are a few lossy transformations you can make to an image before saving it as a PNG that result in a lossy compressed PNG that's smaller than the image otherwise would be. This idea was used a ton with GIFs, it's less popular with PNGs, though. pngquant is one tool I know of that does this. That said, I have no clue if such techniques would result in a smaller image than this approach.