Compression Artifacts on Android? Chrome's Data Saver might be the cause.

[Camaleonyco]

After burying my Flash game developer career, I've started my first Phaser project because I found that some former clients are interested in games... HTML5 games.

It has an 8bit Arcade style, therefore all the art assets are 8bit PNGs. I'm still trying to get rid of the antialias, but I noticed something very odd while I was testing it on an Android phone: The background looked like it was a heavily compressed JPG, instead of an 8bit PNG. I asked a friend to test the game on his Android device and he noticed the compression artifacts too.

First, I blamed Phaser, then my website's hosting... but since it only looked like that on that couple of devices, it had to be an Android issue.

The problem, it seems, comes from Chrome's configuration. By default many devices come with the Data Saver option enabled, which basically changes the way your device requests for certain kind of files. When enabled, it asks a Google server to compress big files (like my 4kb background ¬¬) before sending them to the phone, to make it faster and even cheaper (depending on your mobile plan) to get such files.

That's great... but it makes my game look horrible, and I wouldn't ask the players to disable this option, clear the cache and refresh the browser in order to play my game. I don't need to, because apparently you can ask google to not touch your precious art assets instead. You just need to add a .htaccess file to your root with the following lines:

<FilesMatch "\.(gif|jpg|jpeg|png|gif)$">
    Header set Cache-Control "no-transform"
</FilesMatch>

I don't know how this will affect the distribution, but It worked. If anyone has better solution, please share. Sorry for my English.

Source: http://stackoverflow.com/questions/31314119/disable-chrome-s-data-saver-optimization

[b10b]

Thanks for the heads up.  I had no luck disabling this across the board on my servers - plus I read that doing so may impact SEO scores in future as Google strategy wants this kind of thing.  I ran some tests using the desktop extension - the compression is quick and objective - only returning the artifacted jpeg if the resultant saving is more than a few percent.  So if we're wise with our manual optimisation (and use of pngquant etc) I think the scenarios where this kicks in are appropriate - or rather appropriate flags to us that further optimisation is possible.