PNGs und JPGs verlustfrei per Skript optimieren

Avatar von Christoph Langner

3 Min. Lesezeit

97 Aufrufe

Über 8000 Bilder in der Mediathek verlustfrei kleiner rechnen: ein Skript, das pngcrush und jpegtran rekursiv über alle Upload-Ordner schickt.

Ausgedrückte Zitronen

Aktuell bin ich dabei, ein bisschen im Blog aufzuräumen und etwas Platz auf dem Webspace zu schaffen. Über die Jahre hat sich hier so Einiges angesammelt, wobei der „wp-content/uploads“-Ordner mit allen hochgeladenen Bildern und den generierten Thumbnails mit über 280MB den dicksten Brocken ausmacht. Viele der Bilder bieten Potenzial, mit pngcrush oder jpegtran verlustfrei optimiert zu werden, doch wie lässt man über 8000 Bilddateien in unzähligen Unterverzeichnissen automatisch durch die Tools rattern?

Prinzipiell kann man sich den Aufwand sparen, wenn man von Haus aus in WordPress das Plugin WP-Smush.it installiert. Dieses Plugin schickt alle ins Blog hochgeladenen Bilder nach dem Upload erstmal durch den kostenlosen Bildoptimierer Smush.it von Yahoo! So landen die Bilder von Haus aus optimiert im Blog. Da ich das Plugin längere Zeit nicht benutzt hatte, muss ich nun etwas Handarbeit leisten.

In einem ersten Schritt holt ihr euch alle „wp-content/uploads/<jahreszahl>“ Ordner via FTP auf die Platte. Je nach Einstellung für die Mediathek ist die Ordnerstruktur bei euch ein bisschen anders, aber ich denke, dass ihr schon zu euren Bildern findet. Packt die Bilder danach am besten für ein Backup in ein Archiv, so habt ihr später die Option, die Sache wiederherzustellen, wenn euch die Optimierung nicht gefallen sollte. Installiert danach die nötigen Programme…

$ sudo apt-get install libjpeg-progs pngcrush

…und schmeißt euch das folgende Skript in den ~/bin Ordner (oder wo auch immer ihr eure Skripte liegen habt), ich habe das Skript bei mir unter ~/bin/smush abgelegt. Bitte vergesst danach nicht das abgespeicherte Skript über euren Lieblingsdateimanager oder $ chmod +x ... ausführbar zu machen.

#!/bin/bash
TMPFILE=$(tempfile)
if type -P jpegtran &>/dev/null; then
	echo 'Running jpegtran';
	for JPG in $(find $1 -type f -name \*.jpg);
	do
		echo "crushing $JPG";
		jpegtran -outfile $TMPFILE -copy none -optimize -progressive "$JPG";
		mv -f $TMPFILE $JPG;
	done;
else
	echo 'jpegtran not found';
fi

# Find files with a PNG extension recursively and process with pngcrush
if type -P pngcrush &>/dev/null; then
	for PNG in $(find $1 -type f -name \*.png);
	do
		echo "crushing $PNG";
		pngcrush -brute "$PNG" $TMPFILE;
		mv -f $TMPFILE $PNG;
	done;
else
	echo 'pngcrush not found';
fi

Danach könnt Ihr das Skript auf eure Bilder loslassen. Übergebt dabei einfach den Wurzelordner, den ihr vorhin runtergeladen habt. Bevor ihr das Skript startet, will ich euch jedoch noch eine „Warnung“ mitgeben, speziell das Optimieren der PNGs dauert eine ganze Weile. Bei meinem Bilder-Ordner mit rund 8000 Bildern und etwas mehr als 280MB, hat der Akt auf einem Rechner mit Core i3 CPU sicherlich mehr als zwei Stunden gebraucht.

$ smush ~/foo/bar/uploads

Hat sich der Aufwand gelohnt? Im Schnitt spart man rund 10% pro Bild. Die Größe meines Bilder-Ordners ging von ~281MB auf etwa 260MB runter. Der „geringe“ Ertrag bei mir liegt wohl daran, dass ich vor Jahren schon einmal einen Teil der Bilder optimiert hatte. Wenn Ihr nie WP-Smush.it oder eine andere Methode zum Optimieren verwendet haben solltet, dann bekommt ihr wahrscheinlich bessere Ergebnisse.

$ du -s uploads
281264	uploads
$ du -s uploads_smush
261100	uploads_smush

Gerade wer viele Bilder verblogt, sollte sich auf jeden Fall mal um das Optimieren der Grafiken kümmern. Die im Skript genutzten Methoden reduzieren die Dateigröße, ohne dass es zu einem Qualitätverlust kommt. Von daher lohnt sich die Aktion auf jeden Fall. 10% der Dateigröße bei Bildern wegoptimieren heißt: 10% weniger Traffic durch Bilder und somit auch – auf die Bilder bezogen – 10% schnellere Ladezeit des Blogs.

Ähnliche Beiträge

19 Kommentare zu „PNGs und JPGs verlustfrei per Skript optimieren“

  1. Avatar von Bugmenot
    Bugmenot

    Wow, der Blogger hat ein Shellscript „programmiert“. *applaus*

    1. Avatar von Christoph

      Das ist sie wieder, die Arroganz der Nerds… Ich habe nirgends geschrieben, dass dieser Beitrag eine großartige Errungenschaft darstellen soll. Allerdings gibt es viele Anwender, die vom Schreiben von Shell-Skripten (auch ich will das nicht „Programmieren“ nennen) wenig oder keine Ahnung haben. Die sind froh, wenn sie per Google auf entsprechende Guides stoßen und so mit dem Umgang mit find und Co. vertrauter werden. An dich, als Meisterprogrammierer, richtet sich der Beitrag nicht. 😉

      1. Avatar von Seraphyn

        Wieso,

        ich finde die Idee Gut und habe auch auf meinem Blogs einige simple und eine heftige Scripts.
        Ist doch Gut, wenn man das Rad nicht neu erfinden muss und meiner Meinung nach, freue ich mich immer über so etwas.
        Also lass Dich mal nicht …. ツ
        Seraphyn

        ps: Aber Du solltest nicht nur nach jpg schauen, sondern auch jpeg und Groß- und Kleinschreibung beachten. Dann ist es auch universell einsetzbar. Falls Du Dir die Mühe nicht machen willst, nimm einfach das Kommando und hole Dir dort die Daten des Bildes und setze das ganze dann in for $i in; do blabla.

    2. Avatar von Floh

      Klar, ein normaler Nerd wie du würde ne IDE starten, tausende Bibliotheken einbinden, anschließend den Compiler anschmeißen und zur Krönung auch noch ein *.deb Paket oder ähnliches erstellen.

      Ich hab vor kurzem auch ein paar hundert Bilder verkleinern wollen (Allerdings mit Qualitätsverlust). Das ist auch nur ein einzeiler in der Shell (wers wissen will: –> for i in *.jpg; do convert -resize 20% $i basename $i .jpg_thumb.jpg; done <–)

      Dafür muss man doch kein "richtiges" Programm schreiben.

      tz..

      mfg

      1. Avatar von Seraphyn

        Ja eh nicht,
        u
        nur ich bin ein Fan von automatismen, eine .netrc, einfach etwas in einen Ordner schmeissen, script läuft automatisch und packt es in den Upload-Ordner des Blogs… aber ich hätte nicht gedacht, das Scripte teilen so etwas hervorruft…
        Muss ich mal in meinem Blog aufpassen 🙂

      2. Avatar von Floh

        ähm, vielleicht kurze Erklärung, nicht dass es hier zu missverständnissen kommt: Mein sarkastischer Beitrag bezog sich auf „Bugmenot“.

        Btw: Vor kurzem war eine Diskussion auf heise, wo auch jemand felsenfest behauptet hat, dass Skriptsprachen unnötig seien und Leute, die diese verwenden nur zu faul sind, um C zu lernen.

        Meine Meinung dazu: So ein Schwachsinn. Jedesmal compiler anwerfen, DAS ist unnötig. Skriptsprachen sind schon lange nicht mehr wegzudenken aus unserm Leben. Viele kleine nützliche Helferlein werden in Python, Ruby, Lua oder ähnlichem geschrieben.

        Man sollte für den Einsatzzweck passende Programmiersprache wählen.

        Soviel dazu 🙂

      3. Avatar von FERNmann

        >> Skriptsprachen sind schon lange nicht mehr wegzudenken

        So ist es. Man kann ja mal versuchen, mittels der Paketverwaltung den Python- oder Perl-Interpreter runterzuwerfen. Dann fliegt das halbe System gleich mit.

  2. Avatar von Bugs

    Schritt 2: Das ganze noch so ausbauen, dass man im Menü beim Rechtsklick auf eine Datei die Option Optimieren hat und ausführen kann (auf die eine Datei bezogen) :o)

    War interessant zu lesen und schönes schlankes Design.. :o)

    Bugs

    1. Avatar von Christoph

      Mit exakt diesem Skript würde ich das nicht machen, da es ja eher eine einmalige Aktion ist. Aber für einzelne Bilder kann man das mit Nautilus Actions eigentlich recht schnell machen.

  3. Avatar von FERNmann

    Vielleicht sollte man noch erwähnen, dass das Skript sämtliche Metadaten (z.B Schlagworte) der JPEGs löscht. Ist das so gewollt?

    1. Avatar von Christoph

      In meinem Fall schon, es geht drum die Bilder ins Netz hochzuladen, und dort finde ich ausführliche Exif-Infos – nicht immer – optimal. Immerhin lässt sich so einiges herausfinden, selbst gestohlene oder verlorengegangene Kameras lassen sich über das Netz wiederfinden 😉

      1. Avatar von Seraphyn

        Hast Du eine dieser Kameras *fg* 😉
        Gruss und schönes WE
        Chris

  4. Avatar von Gorja

    danke für das skript… sowas in der Art habe ich gebraucht… hat mir 14% eingespart 🙂 mal sehen, wieviel Traffic das spart… :>

    [Trollfutter]Scripten ist scheisse! ich will nur vorkompilierte Pakete, an denen ich nichts ändern kann und die für jede Prozessor-Plattform neu gepackt und debuggt werden müssen… Dazu noch saftige Software-Lizenzen [EULA] und alles am liebesten noch vorinstalliert und eingerichtet… Euer sch***s Open-Source macht meine schöne Windows-Raubkopie-Welt kaputt… [/Trollfutter]

    €dith sagt: mach keine Schlechtfeibschrehler!

    1. Avatar von Christoph

      Super, mit so einem Prozent-Wert hab ich gerechnet. Das sollte letztendlich schon Einiges sparen. Kommt natürlich auf das eigene Template und das Inhalte/Bilder Verhältnis an.

  5. Avatar von fremdkoerperfalle
    fremdkoerperfalle

    Danke für den Beitrag.

    🙂

  6. Avatar von DSIW

    Hallo Christoph,
    wieso nutzt du nicht die GIMP-Funktion, die du schonmal hier im Blog erwähnt hattest?
    Siehe http://linuxundich.de/de/ubuntu/bilder-fur-das-web-aufbereiten/

    Gruß DSIW

    1. Avatar von Christoph

      Weil das Gimp-Skript in aktuellen Versionen nicht mehr funktioniert.Außerdem hat die farboptimierte Palette den Nachteil, dass Farbverläufe nicht mehr wirklich gut aussehen.

      Grüße
      Christoph

  7. Avatar von Daniel Weihmann

    Danke für die Infos und das Script, war genau wonach ich gesucht habe.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Markdown wird unterstützt: **fett**, _kursiv_, [Linktext](URL), `Code`, Zeilen mit - für Listen, 1. für nummerierte Listen, dreifache Backticks für Codeblöcke.

Sicherheitsabfrage: Welches Logo ist das?

Über den Blog

Seit 2006 probiere ich hier aus, was Linux, freie Software und die passende Hardware so hergeben – von Distributions-Tests bis zum Raspberry-Pi-Projekt. Praxisnah statt bloßem Nachrichtenticker.

Zuletzt auf Mastodon

Scene Composer in Aktion: Ein Screenshot wird geladen, in verschiedene 3D-Szenen wie Café, Gaming-Desktop, Homeoffice und Podcast-Studio eingesetzt, gedreht und gezoomt. Anschließend wird eine Vorschau gerendert.

Ich finde Screenshots als Aufmacher oft langweilig. In der Vergangenheit habe ich daher oft den Bildschirm im wahrsten Sinne des Wortes abfotografiert. Das bringt etwas Leben in die Artikel –…

Kategorien

Blog unterstützen

Gefällt dir, was du hier liest? Mit einer kleinen Spende hilfst du, Hosting und neue Testgeräte zu finanzieren – und sorgst nebenbei für den nötigen Kaffee.

Linux und Ich — PNGs und JPGs verlustfrei per Skript optimieren
https://linuxundich.de/webhosting/pngs-und-jpgs-verlustfrei-per-skript-optimieren/ — gedruckt am 26. September 2026