Wordpress image compression, is it possible without a plugin?

Question

Images

Good afternoon.
The template is almost empty. No plugin comments, etc. Clean in general.
When uploading images to the site, 2 sizes are generated. One original and one 200px*200px
Display 20 miniatures with links on the main page. We get the site loading speed of 2-2.5 s. I thought the problem was in the output script. I ran it on webpagetest, it turns out that it loads the most pictures.
I ran the site through the webspeedtest.cloudinary service, got that 20 pictures weigh 407.0 KB
And you can optimize up to 81.4 KB. The difference is significant.
Now the question itself. Is it possible to somehow optimize images automatically, but only those that are 200px * 200px in size. If it is not possible automatically, is it possible manually? I uploaded pictures to the site, took them to the local network via FTP, optimized them and uploaded them again via FTP. Will it be correct? I would not like to use the plugin, but if there is a good one, you can try it.

Answer 1

Hello!
1) you can optimize pictures with plugins. I usually use ewww image optimizer or tinypng
2) As a colleague pointed out, you can optimize images in photoshop. ( ctrl + shift + alt + s or save for web) and set the quality to 30%
3) You can download the uploads folder, install the jpegoptim console program, jpegtran optipng, etc. and optimize images. You can choose the quality yourself, but usually 30% minimum, since pixelation is already visible at 25%
4) If you have VPS / VDS and have the opportunity to install the above console utilities, then you can not download photos, but optimize on the server.
5) You can automate step 4 by writing a small PHP script that will select pictures of the desired size by regex 200x200 pixels, and then optimize them using the utilities listed in step 3. And in order for this to happen regularly, hang up a CRON task.
PS avoid the bmp tiff gif format. Use png jpeg webp

Answer 2

Perhaps in the wrong steppe, but my suggestion is to think about image processing on the client side, in javascript, here is a beautifully painted simple code.
It's just logical, why load the server with what can be left on the client side?