How I optimize images and SVG

¶ Small amounts of JPG and PNG

1. Use TinyPNG to optimize jpg and png formats.
2. If applicable, convert to WEBP and AVIF.

¶ Bigger (moderate) amounts of JPG and PNG

Bake in imagemin into whatever build process the project uses.

¶ Big amounts of JPG and PNG

Use dedicated service like IMGIX or Cloudinary. I would probably even skip imagemin phase and go straight for the shelf. Seriously, it’s always worth the money.

¶ Small amounts of SVG

Use SVGOMG.

¶ Bigger amounts of SVG

Bake in SVGO into whatever build process the project uses. In the past, this included using webpack and Gulp plugins built on top of it. This approach should scale to very large amounts of SVG.