resize-pictures.md (4532B)
1 # Resizing my website's pictures with ImageMagick and find(1) 2 3 I have noticed that most of the pictures I have uploaded on this website 4 are incredibly large: 5 6 ``` 7 $ du -h -d 1 sebastiano.tronto.net 8 42M sebastiano.tronto.net/gemini 9 42M sebastiano.tronto.net/http 10 42M sebastiano.tronto.net/src 11 100M sebastiano.tronto.net/.git 12 225M sebastiano.tronto.net 13 ``` 14 15 Stupid modern phones and their multi-megapixel cameras! I definitely 16 do not want my minimalist blog to waste your bandwidth, I have to fix 17 this. I could just go through all my pictures and resize them one by 18 one with something like [gimp](https://www.gimp.org/) - there are like 19 10 of them. But that's boring. Let's do it with the command line instead! 20 21 ## ImageMagick 22 23 The obvious question is: how do we even edit a picture 24 with the command line? Luckily, there is a tool for that: 25 [ImageMagick](https://imagemagick.org/). This piece of software can do a 26 ton of things, and I do not use it very often, so I always need to look 27 up what I want to do. 28 29 One way to invoke ImageMagick is by 30 calling the `convert` command, which can take a 31 [`-resize`](https://imagemagick.org/script/command-line-options.php#resize) 32 option, followed by a 33 [`geometry`](https://imagemagick.org/script/command-line-processing.php#geometry) 34 argument. After checking the online manual, I understood that the command 35 I was looking for was: 36 37 ``` 38 $ convert picture.jpg -resize "750>" picture.jpg 39 ``` 40 41 which resizes `picture.jpg` by scaling it down to at most 750px width - 42 preserving the ratio between width and height, and leaving the picture 43 untouched if it is already smaller. The value 750 was chosen after a 44 couple of attempts, it seems a good compromise between quality and size. 45 46 And now I just have to do this for all pictures. Of course, running the 47 same command 10 times with a different argument is out of question. 48 49 ## find(1) 50 51 *(No "man page reading club" this time, but don't 52 worry, the series will be back soon.)* 53 54 A standard UNIX command, [`find`](https://man.openbsd.org/find) allows 55 you to scan a folder for files with certain properties (for example, 56 a certain name pattern) and perform actions on them (for example, 57 running a command). The OpenBSD and GNU versions of find have some 58 differences, check your local manual page. The commands I use 59 here have been tested on the GNU version, but should be standard. 60 61 To look for files and simply print their name, we can use `-name`: 62 63 ``` 64 $ find src -name \*.jpg -or -name \*.png 65 src/me.png 66 src/favicon.png 67 src/speedcubing/cubing.png 68 src/blog/2023-01-28-windows-desktop/settings.png 69 src/blog/2023-01-28-windows-desktop/tiling.png 70 src/blog/2022-09-10-netbooks/darkstar.jpg 71 src/blog/2022-09-10-netbooks/final.jpg 72 src/blog/2022-09-10-netbooks/scramble.jpg 73 src/blog/2022-09-10-netbooks/hd.jpg 74 src/blog/2023-02-25-job-control/jobs-diagram.png 75 src/blog/2022-12-30-blog-ready/pc-planner.jpg 76 ``` 77 78 Notice how I had to escape the `*`: the strings `\*.jpg` and `\*.png` 79 are part of the find command, we don't want the shell to expand them. 80 81 Now we can use `-exec` to run a command on each of these files, 82 using `{}` to refer to the file's name: 83 84 ``` 85 $ find src \( -name \*.jpg -or -name \*.png \) -exec convert {} -resize "750>" {} \; 86 ``` 87 88 We get a couple of warnings about grayscale images, but whatever. 89 This seems to have worked. 90 91 ## The weight of history 92 93 Let's see if things have improved: 94 95 ``` 96 $ du -h -d 1 sebastiano.tronto.net 97 19M sebastiano.tronto.net/gemini 98 19M sebastiano.tronto.net/http 99 19M sebastiano.tronto.net/src 100 102M sebastiano.tronto.net/.git 101 158M sebastiano.tronto.net 102 ``` 103 104 That's... a bit disappointing. It looks like large pictures were not 105 the only culprit - all the [slides for my math talks](../../research) 106 are also quite heavy. Too bad, I am not going to change them now. 107 Maybe in a follow-up post :-) 108 109 Just like me with my old slides, git also wants to keep a memory 110 of the past. After all, this is what version control system are 111 supposed to do. If you are wondering why my website is a git 112 repository, check out 113 [this old blog post of mine](../2022-08-14-website). In the end, 114 I don't really need the ability to revert my website to an older 115 version, so I could just reset the repo from all the history 116 at some point. 117 118 ## Conclusion 119 120 ImageMagick is and find are both powerful tools. I am happy with looking 121 up ImageMagick's syntax everytime, but I definitely want to become more 122 proficient with find. 123 124 This was not a hard task, but I have learned something new. I hope you 125 did too :-)