Hi,
my happiness lasted a couple days: I thought I had found a great way to decrease the size of my spritesheets by adopting WebP format, but I have just discovered that FireFox doesn’t support it, FRAK! I didn’t consider that the decoding was done by the browser specific VM…
What do you know about WebP support? I have found this table , the situation is not good…
I think I will have to detect the browser and load different assets…
Hi, can’t help with webP but just in case you don’t know : tinyPNG can significantly reduce your PNGs/JPGs file weight https://tinypng.com/ (there might be offline tools / plugins that do the same, haven’t looked)
I use SuperPNG in Photoshop, I wonder if TinyPNG is better, I should do some test, with JPG too.
There’s OptiPNG, which is open source.
You can’t use a PNG compressor on a JPG…
Or do you mean that you’re considering switching to using JPG files?
My custom version of the spritesheet library allows us to use a separate image (a greyscale PNG) to add alpha channel to whatever format, so I could use JPG to create trasparent images, but I’d prefer to avoid to add the alpha-channel-extraction process to our pipeline.
WebP looks like the right way to get the best of both JPG and PNG worlds.
Maybe you can try PNG-8 from TexturePacker? However the result depends of your colors.
Or maybe .ATF format? I don’t remember if it works on HTML5…
We use TexturePacker regularly for spritesheets, and its compression algorithms are great, but our graphic prefer to take control of the compression parameters later in PS.
PNG8 introduces dithering that sometimes is not as good as a medium/high quality WebP/JPG… that give smaller files.
I have never used ATF, but… I doubt it would work in HTML5, we are strictly limited to standard formats, BMP, PNG, GIF and JPG, I think.
With ATF you could use DXT1 in webgl. But DXT1 may have some trouble with gradient if I remember correctly. So it depends of your images. But your image is directly uploaded in the GPU => faster and lighter!
But I would be forced to use webgl…
FileOptimizer is as low as you will get on PNG (By mashing your pngs through ALL compressors available).
If you want lower, you can use it to get Lossy PNG compression.
If you want even lower… JPG 
TexturePacker compression level (PNG8, with quantization) is awesome, and gets the work done in a single passage: spritesheet + compression.
But WebP is unbeatable, for me, in this context: no dithering, alpha channel, smaller files than both PNG8 and JPG with higher quality, I wonder why we are still struggling with the ancient JPG and (already dead and revived) GIF formats…