Before serving images to a website or app try compressing them. Try different options and iterate until you find the balance between how crisp you need the img to look and file size.
smaller sized images will make your app load faster and more performant.

I analized zellerfeld website which uses VERY high quality looking videos and images. here are some of the files used:

• home-section1-animation-1980x1080.mp4 -> 3.7MB
• section3-Animation-990x990.mp4 -> 2.7MB
• Section2-tilted-570x400x2-transparency.avif -> 157 KB
  This is to give a rough idea of what file formats and sizes one should aim for.

img file formats

png

higher bitrate and supports transparency

jpeg

smallest, less bitrate, doesn't support transparency

SVG (scalable vector graphic).

• cpu calculates math of graphic
• scales indefinitely
• good for icons, very simple images that have simple shapes and colors. if you export svg of complex images you will notice very large file sizes.

webp

recommended standard rn for web and android
best quality/file size ratio
not supported by internet explorer I think (who cares?)

avif

even more modern optimizations than webp, might be less supported.

2025-05-21: I tried using avif instead of webp on webflow and the quality of images are much better and they take up less storage.

video file formats

usually mp4, or webm.

compression tools

• clop ⭐️ clipboard optimizer. with a bunch of useful features I haven't tried yet
  • watermarking

image compression

• squoosh images
• compressimage.io batch compressing
• mass image compressor
• photoshop or gimp
• ImageOptim
• tinypng/ tinyjpg: despite the name it supports all file formats
  • somewhat popular options amongs devs because they offer an API for automated workflows.

video compression
VMAF is a score used to measure how close a compressed video looks to it's original source. one should aim for >95%.

• handbrake ⭐️
  good default settings:
  use H.265 (NVENC if nvidia gpu)
  quality: 30 (larger means more comp) anything below 30 gives a score larger than 95vmaf and anything below 23 give 99
  encoder preset: faster
  audio mp3 bitrate 192
• adobe media encoder
• ffmpeg CLI