Case Study: Einsatz von WEBP

WEBP als Umweltbewusstsein in der Web-Entwicklung

In der heutigen Zeit wird das Thema Umweltbewusstsein immer wichtiger. Auch in der Web-Entwicklung sollte man versuchen, umweltfreundlicher zu arbeiten. Eine Möglichkeit, um dies zu erreichen, ist der Einsatz von WEBP Bildern.

Früher hat man beim Programmieren versucht, möglichst wenig Speicher zu verbrauchen und hat Bytes gezählt. Allerdings ist in der heutigen Zeit der Speicherplatz nicht mehr das größte Problem, sondern eher die Geschwindigkeit der Website. Auch der Traffic spielt eine immer wichtigere Rolle. Eine große Datenmenge kann dazu führen, dass die Website langsamer lädt, was wiederum negative Auswirkungen auf die User Experience hat. Zudem verbraucht eine langsame Website mehr Strom und belastet dadurch die Umwelt zusätzlich.

Lösung

Der Einsatz von WEBP Bildern

Eine Möglichkeit, um die genannten Probleme zu lösen, ist der Einsatz von WEBP Bildern. WEBP ist ein von Google entwickeltes Bildformat, das eine hohe Kompressionsrate bietet. Das bedeutet, dass Bilder in WEBP-Format deutlich weniger Speicherplatz benötigen als herkömmliche Bildformate wie PNG oder JPEG. Durch den geringeren Speicherbedarf werden weniger Daten übertragen und die Website lädt schneller. Dies reduziert wiederum den Stromverbrauch der Website und spart somit Energie.

Ergebnis

Umweltbewusster Erfolg

Der Einsatz von WEBP Bildern hat sich als äußerst erfolgreich erwiesen. Durch die Verwendung von WEBP konnte die Größe der Bilder auf der Website erheblich reduziert werden. Dadurch wurden weniger Daten übertragen und die Website lädt schneller. Dies führte zu einer verbesserten User Experience und einem positiven Feedback der Nutzer. Zudem konnte durch den Einsatz von WEBP der Stromverbrauch der Website reduziert werden, was zur Umweltfreundlichkeit beigetragen hat.

Fazit

WEBP spart Speicher, Traffic und Strom

Der Einsatz von WEBP Bildern bietet eine umweltfreundliche Möglichkeit, um die Größe von Bildern auf einer Website zu reduzieren. Durch die geringere Datenmenge werden Speicherplatz und Traffic eingespart, was wiederum die Ladezeit der Website verkürzt und den Stromverbrauch reduziert. Somit kann der Einsatz von WEBP Bildern als ein wichtiger Schritt in Richtung einer umweltfreundlichen Web-Entwicklung angesehen werden.

Mathematische Größenvergleiche zwischen WEBP, JPEG und PNG

  • Dateigröße: WEBP bietet eine höhere Kompressionsrate als JPEG und PNG. Dadurch ist die Dateigröße von WEBP-Bildern im Vergleich zu JPEG und PNG kleiner.

  • Kompressionsrate: Die Kompressionsrate von WEBP ist höher als die von JPEG und PNG. Das bedeutet, dass WEBP-Bilder im Vergleich zu JPEG und PNG eine höhere Qualität bei einer geringeren Dateigröße bieten.

  • Farbtiefe: WEBP unterstützt eine höhere Farbtiefe als JPEG und PNG. Während JPEG und PNG nur 8-Bit-Farbtiefe unterstützen, kann WEBP Bilder mit bis zu 32-Bit-Farbtiefe speichern.

  • Transparenz: WEBP unterstützt sowohl undurchsichtige als auch teilweise transparente Pixel. PNG unterstützt auch transparente Pixel, aber JPEG bietet keine Unterstützung für Transparenz.

  • Animation: WEBP unterstützt auch animierte Bilder, während JPEG und PNG nur statische Bilder unterstützen.

Insgesamt bietet WEBP als Bildformat eine höhere Kompressionsrate, eine höhere Farbtiefe und Transparenzunterstützung im Vergleich zu JPEG und PNG. Dadurch können WEBP-Bilder eine höhere Qualität bei einer geringeren Dateigröße bieten, was wiederum zu einer schnelleren Ladezeit der Website führt.

Einige Beispiele für die Dateigrößenkompression von WEBP, PNG und JPEG bei unterschiedlichen Qualitätsstufen

Für ein Beispielbild mit einer Größe von 1000 x 1000 Pixeln und einer ursprünglichen Dateigröße von 500 KB ergeben sich folgende Dateigrößen bei unterschiedlichen Kompressionsraten:

Wie man sehen kann, bietet WEBP eine höhere Kompressionsrate als PNG und JPEG bei gleicher Bildqualität. Selbst bei einer Kompressionsrate von 80% hat WEBP immer noch eine höhere Kompressionsrate als PNG und JPEG bei 50% Kompressionsrate. Dadurch kann der Einsatz von WEBP-Bildern auf einer Website zu einer erheblichen Reduktion der Dateigröße und somit zu einer schnelleren Ladezeit der Website führen.

Auswirkungen auf einen Onlineshop

Angenommen, wir haben einen Online-Shop mit 5.000 Produkten, wobei jedes Produkt 3 Bilder mit einer Größe von 800×800 Pixeln hat. Wir möchten nun berechnen, wie viel Speicherplatz wir durch den Einsatz von WEBP anstelle von JPEG und PNG sparen können.

Zunächst müssen wir die Dateigrößen der Bilder berechnen. Ich gehe davon aus, dass die JPEG-Bilder eine durchschnittliche Größe von 100 KB und die PNG-Bilder eine durchschnittliche Größe von 300 KB haben. Bei einer Kompressionsrate von 80% würde WEBP eine durchschnittliche Größe von 30 KB haben.

Wie man sehen kann, bietet WEBP eine höhere Kompressionsrate als PNG und JPEG bei gleicher Bildqualität. Selbst bei einer Kompressionsrate von 80% hat WEBP immer noch eine höhere Kompressionsrate als PNG und JPEG bei 50% Kompressionsrate. Dadurch kann der Einsatz von WEBP-Bildern auf einer Website zu einer erheblichen Reduktion der Dateigröße und somit zu einer schnelleren Ladezeit der Website führen.

PNG

Durchschn. Größe von 300 KB
3 Bilder x 300 KB = 900 KB
5.000 Produkte x 900 KB = 4,5 GB

JPEG

Durchschn. Größe von 100 KB
3 Bilder x 100 KB = 300 KB
5.000 Produkte x 300 KB = 1,5 GB

WEBP

Durchschn. Größe von 30 KB (bei 80%)
3 Bilder x 30 KB = 90 KB
5.000 Produkte x 90 KB = 450 MB

Wie man sehen kann, würde der Einsatz von WEBP bei den Produktbildern in diesem Online-Shop eine signifikante Reduktion des Speicherbedarfs bewirken. Statt 6 GB (1,5 GB für JPEG und 4,5 GB für PNG) würde man nur noch 450 MB benötigen, was einer Reduktion von über 90% entspricht.

Was bedeutet das im Bezug auf Strom Ersparnis in einem Jahr

Um die mögliche Stromersparnis in Euro zu berechnen, müssten wir weitere Informationen über die genauen Stromkosten und den Stromverbrauch des Online-Shops haben. Allerdings kann man eine grobe Schätzung machen, um eine Vorstellung von der Größenordnung der möglichen Einsparungen zu bekommen.

Angenommen, der Online-Shop benötigt für den Betrieb der Server, die die Bilder hosten, einen Stromverbrauch von etwa 10 kW. Wenn wir davon ausgehen, dass dieser Verbrauch gleichmäßig über das Jahr verteilt ist und die Stromkosten bei etwa 0,30 Euro pro kWh liegen, dann würde der Online-Shop in einem Jahr etwa 10 kW x 24 Stunden x 365 Tage x 0,30 Euro/kWh = 2628 Euro an Stromkosten verursachen.

Durch den Einsatz von WEBP anstelle von JPEG und PNG könnten wir den Speicherbedarf für die Bilder um etwa 90% reduzieren. Wenn wir davon ausgehen, dass die Produktbilder etwa die Hälfte des Gesamtspeicherbedarfs des Online-Shops ausmachen, dann könnten wir durch den Einsatz von WEBP den Stromverbrauch um etwa 45% senken. Das würde eine jährliche Ersparnis von etwa 1182 Euro bedeuten.

Diese Schätzung basiert auf einigen Annahmen und es gibt viele Faktoren, die den tatsächlichen Stromverbrauch und die Stromkosten beeinflussen können. Dennoch zeigt es, dass der Einsatz von WEBP nicht nur den Speicherbedarf reduzieren, sondern auch zu erheblichen Einsparungen bei den Stromkosten führen kann.

Strom Ersparnis

45%

Ohne WEBP:  2628 Euro
Mit WEBP:  1.446 Euro

Welche Auswirkungen hat das auf die Lebenszeit von Hardware wie z.B. Festplatten

Der Einsatz von WEBP anstelle von anderen Bildformaten kann sich positiv auf die Lebensdauer von Festplatten und anderen Speichermedien auswirken. Das liegt daran, dass die Verwendung von kleineren Dateien weniger Schreib- und Lesevorgänge erfordert und dadurch weniger Abnutzung der Hardware verursacht.

Wenn ein System viele große Dateien speichert, werden mehr Schreib- und Lesevorgänge auf der Festplatte ausgeführt, was zu einer höheren Belastung der Leseköpfe führt. Die Leseköpfe sind empfindliche Bauteile, die bei häufigen Schreib- und Lesevorgängen abgenutzt werden können. Je mehr Schreib- und Lesevorgänge durchgeführt werden, desto höher ist die Wahrscheinlichkeit, dass die Festplatte ausfällt.

Durch die Verwendung von WEBP-Dateien, die eine kleinere Größe haben als andere Bildformate, wird die Anzahl der Schreib- und Lesevorgänge reduziert und somit auch die Belastung der Festplatte. Dadurch kann die Lebensdauer der Hardware verlängert werden.

Es ist jedoch zu beachten, dass die Lebensdauer von Festplatten und anderen Speichermedien von vielen Faktoren abhängt, wie z.B. der Qualität der Hardware, der Betriebsdauer und der Temperatur. Der Einsatz von WEBP allein kann also nicht garantieren, dass die Lebensdauer der Hardware verlängert wird. Es kann jedoch ein Faktor sein, der dazu beiträgt, die Belastung der Festplatte zu reduzieren und somit die Lebensdauer zu erhöhen.

Verbesserung der Umwelt durch weniger Verbrauch von Hardware

Der Einsatz von WEBP-Dateien kann auch zu einer Verbesserung der Umwelt beitragen, indem er dazu beiträgt, den Verbrauch von Hardware und damit auch von Ressourcen zu reduzieren.

Wenn eine Webseite oder ein Online-Shop viele Bilder hostet, benötigt dies zusätzlichen Speicherplatz und erfordert in der Regel den Einsatz von mehreren Servern. Jeder Server verbraucht Energie und Ressourcen, um zu funktionieren. Durch den Einsatz von WEBP-Dateien, die eine kleinere Größe haben als andere Bildformate, kann der Speicherbedarf reduziert werden. Dadurch wird auch die Anzahl der Server, die benötigt werden, um die Bilder zu hosten, reduziert.

Eine geringere Anzahl von Servern führt zu einem geringeren Verbrauch von Ressourcen wie Strom und Materialien, die für die Herstellung von Servern und anderen Hardware-Komponenten benötigt werden. Darüber hinaus kann der Einsatz von weniger Servern auch zu einer Verringerung der Abwärme führen, die von den Servern erzeugt wird. Dies kann dazu beitragen, den Energiebedarf für die Kühlung der Server zu reduzieren.

Durch die Reduzierung des Verbrauchs von Hardware und Ressourcen kann der Einsatz von WEBP-Dateien somit einen Beitrag zur Verbesserung der Umwelt leisten, indem er dazu beiträgt, den ökologischen Fußabdruck von Webseiten und Online-Shops zu reduzieren.

Auswirkung auf die Ladezeit einer Durchschnittlichen Startseite von Onlineshops

Die Verwendung von WEBP-Bildern anstelle von JPEG und PNG kann die Ladezeit einer Website deutlich verbessern. Durch die geringere Dateigröße werden WEBP-Bilder schneller heruntergeladen und angezeigt, was insgesamt zu einer schnelleren Ladezeit führt.

Um die Auswirkungen auf die Ladezeit einer durchschnittlichen Startseite eines Onlineshops zu berechnen, gehen wir von folgenden Annahmen aus:

  • Die durchschnittliche Größe einer Startseite eines Onlineshops beträgt 2,5 MB (dies ist eine Schätzung und kann je nach Website variieren).
  • Die durchschnittliche Anzahl von Bildern auf einer Startseite beträgt 10 (ebenfalls eine Schätzung und kann je nach Website variieren).
  • Die durchschnittliche Größe eines Bildes beträgt 250 KB (basierend auf einer durchschnittlichen Größe von 500 x 500 Pixeln).
  • Bei einem Traffic von 100 Benutzern wird die Startseite 100 Mal gleichzeitig geladen.

Unter Verwendung dieser Annahmen können wir berechnen, wie viel Zeit benötigt wird, um die Startseite mit WEBP-, JPEG- und PNG-Bildern zu laden.

Angenommen, wir gehen von den in der vorherigen Frage genannten Durchschnittsgrößen für die drei Bildformate aus, ergeben sich folgende Berechnungen für die Ladezeit:

  1. WEBP: 10 Bilder x 95 KB = 950 KB für alle Bilder auf der Seite. 950 KB x 100 Benutzer = 95 MB Traffic. Bei einer durchschnittlichen Geschwindigkeit von 3 Mbps ergibt dies eine Ladezeit von etwa 32 Sekunden.
  2. JPEG: 10 Bilder x 103 KB = 1.03 MB für alle Bilder auf der Seite. 1.03 MB x 100 Benutzer = 103 MB Traffic. Bei einer durchschnittlichen Geschwindigkeit von 3 Mbps ergibt dies eine Ladezeit von etwa 34 Sekunden.
  3. PNG: 10 Bilder x 386 KB = 3.86 MB für alle Bilder auf der Seite. 3.86 MB x 100 Benutzer = 386 MB Traffic. Bei einer durchschnittlichen Geschwindigkeit von 3 Mbps ergibt dies eine Ladezeit von etwa 128 Sekunden.

Wie man sieht, kann die Verwendung von WEBP-Bildern die Ladezeit der Startseite erheblich reduzieren, insbesondere bei höherem Traffic. Bei 100 Benutzern würde die Verwendung von WEBP-Bildern gegenüber JPEG-Bildern etwa 2 Sekunden und gegenüber PNG-Bildern sogar etwa 96 Sekunden einsparen.

Interessante Links