File size: 3,000 Bytes
980dc8d
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
---

title: "Images: Compression"
original_url: "https://tds.s-anand.net/#/image-compression?id=images-compression"
downloaded_at: "2025-06-08T23:26:15.003538"
---


[Images: Compression](#/image-compression?id=images-compression)
----------------------------------------------------------------

Image compression is essential when deploying apps. Often, pages have dozens of images. Image analysis runs over thousands of images. The cost of storage and bandwidth can grow over time.

Here are things you should know when you’re compressing images:

* **Image dimensions** are the width and height of the image in pixels. This impacts image size a lot
* **Lossless** compression (PNG, WebP) preserves exact data
* **Lossy** compression (JPEG, WebP) removes some data for smaller files
* **Vector** formats (SVG) scale without quality loss
* **WebP** is the modern standard, supporting both lossy and lossless

Here’s a rule of thumb you can use as of 2025.

* Use SVG if you can (i.e. if it’s vector graphics or you can convert it to one)
* Else, reduce the image to as small as you can, and save as (lossy or lossless) WebP

Common operations with Python:

```

from pathlib import Path

from PIL import Image

import io



async def compress_image(input_path: Path, output_path: Path, quality: int = 85) -> None:

    """Compress an image while maintaining reasonable quality."""

    with Image.open(input_path) as img:

        # Convert RGBA to RGB if needed

        if img.mode == 'RGBA':

            img = img.convert('RGB')

        # Optimize for web

        img.save(output_path, 'WEBP', quality=quality, optimize=True)



# Batch process images

paths = Path('images').glob('*.jpg')

for p in paths:

    await compress_image(p, p.with_suffix('.webp'))Copy to clipboardErrorCopied

```

Command line tools include [cwebp](https://developers.google.com/speed/webp/docs/cwebp), [pngquant](https://pngquant.org/), [jpegoptim](https://github.com/tjko/jpegoptim), and [ImageMagick](https://imagemagick.org/).

```

# Convert to WebP

cwebp -q 85 input.png -o output.webp



# Optimize PNG

pngquant --quality=65-80 image.png



# Optimize JPEG

jpegoptim --strip-all --all-progressive --max=85 image.jpg



# Convert and resize

convert input.jpg -resize 800x600 output.jpg



# Batch convert

mogrify -format webp -quality 85 *.jpgCopy to clipboardErrorCopied

```

Watch this video on modern image formats and optimization (15 min):

[![Modern Image Optimization (15 min)](https://i.ytimg.com/vi_webp/F1kYBnY6mwg/sddefault.webp)](https://youtu.be/F1kYBnY6mwg)

Tools for image optimization:

* [squoosh.app](https://squoosh.app/): Browser-based compression
* [ImageOptim](https://imageoptim.com/): GUI tool for Mac
* [sharp](https://sharp.pixelplumbing.com/): Node.js image processing
* [Pillow](https://python-pillow.org/): Python imaging library

[Previous

Markdown](#/markdown)

[Next

Static hosting: GitHub Pages](#/github-pages)