Image compression on your site. How to implement?

Question

PHP

Here Google Analytics somehow determines that the image has no compression. And he says that it must be done.
1) it unequivocally selects photos that are larger than the container
Allegedly, it is necessary for the container to be 200-200 and the photo is the same there. Although thinking about responsive pages - there just a photo can change on different devices, up to using smooth resizing. And if you put in a stable picture, then resizing the photo with a smooth increase in the size of the viewport will no longer work
2) it seems to show pictures that I didn’t “saved for the web” before publishing and didn’t run through fast stone
where it somehow cunningly compresses it, without changing the quality. here this compression interests more
Actually a question - and what bestpractice of operation with pictures?
I heard there is still a problem on iPhones, that like pictures are loaded like soap, if they are not immediately cut to size

Answer 1

1) Google JS-cat compares the actual size of the image and the one in which it is displayed.
2) It necessarily cuts meta information from the image file, in some cases it can be larger than the image itself.
Then for jpeg, where the compression / compression parameter is provided from 0 to 100, it most likely swears if it is more than 70-75. Because from 75 to 100 the difference is usually not visible, and the size is noticeably smaller. (100 is uncompressed)
For png, you can change the bit depth (8,16,24,32,48,64) if it is not used effectively. Bitness is the number of bits used to encode one pixel, it determines the number of available colors and the depth of the alpha channel. Those. png8 is 256 colors without alpha. PNG does not have a compression option.
For GIF, this is from two to 256 colors in a custom palette, the fewer colors in the palette, the smaller the file.
Accordingly, automatic optimization for PNG and GIF can only be done by analyzing the color in each pixel, this is tedious and resource-intensive on the fly. And accordingly, almost no one bothers with this.
Also, these formats have several additional options that also affect the size of the image, but not significantly.

Answer 2

Click all the pictures with the kracken.io service and the situation will improve significantly.

Answer 3

Wangyu that for the node there is a stray that needs to be kicked with gulp, for example (well, or with pens).
In general, if Google even says, then this is not the last resort.