Google verwendet KI-Technologie, um Inhalte in Ihre bevorzugte Sprache zu übersetzen. KI-Übersetzungen können Fehler enthalten.

Anwendungsfälle für die Bildoptimierung

Auf dieser Seite finden Sie Beispiele für das erweiterte Verhalten bei der Bildverarbeitung, Auswirkungen der Pipeline-Reihenfolge und Regeln für die automatische Bildnormalisierung.

Reihenfolge der Transformationen

Vorgänge im Abfrageparameterstring imop werden sequenziell von links nach rechts ausgeführt, mit Ausnahme von metadata oder scale, die zuerst ausgeführt werden, und canvas, die zuletzt ausgeführt wird. Da sich jeder Vorgang direkt auf die visuelle Ausgabe des vorherigen Vorgangs auswirkt, beeinflusst die Reihenfolge der Parameter die endgültige visuelle Qualität und die Detailgenauigkeit des abgeleiteten Bildes.

Nehmen wir ein Quellbild mit einer Breite von 1.000 Pixeln und einer Höhe von 1.000 Pixeln an:

Beispiel: Resize und dann Crop

https://www.example.com/image.jpg?imop=Resize,width=200;Crop,left=0.5

Größe ändern: Die Größe des ursprünglichen Bildes mit 1.000 × 1.000 Pixeln wird auf 200 × 200 Pixel (das Seitenverhältnis 1:1 bleibt erhalten).
Zuschneiden: Mit dem Vorgang left=0.5 wird die linke Hälfte des bereits verkleinerten Bildes abgeschnitten.

Ergebnis: Ein 100 × 200 Pixel großes Bild, das die rechte Hälfte des Inhalts darstellt.

Beispiel : Crop und dann Resize

https://www.example.com/image.jpg?imop=Crop,left=0.5;Resize,width=200

Zuschneiden: Mit dem left=0.5Vorgang wird zuerst die rechte Hälfte des hochauflösenden Quellbildes extrahiert. Dadurch entsteht ein 500 x 1000 px Zwischenbild (das Seitenverhältnis ändert sich zu 1:2).
Größe ändern: Mit dem width=200 Parameter wird die Größe dieses Zwischenbildes geändert. Um das neue Seitenverhältnis von 1:2 beizubehalten, wird die Höhe auf 400 Pixel skaliert.

Ergebnis: Ein 200 × 400 Pixel großes Bild.

Verhalten beim Strecken und Hochskalieren

Standardmäßig erzwingt der Bildoptimierungsdienst eine strikte Strategie, bei der nur die Größe verringert wird, um die Bandbreite für die Edge-Bereitstellung zu sparen und die visuelle Qualität zu schützen. Wenn Sie Abmessungen anfordern, die größer als die des Originalbildes sind, ignoriert Cloud CDN die Vergrößerung und gibt das Bild in seiner ursprünglichen Größe aus.

Wenn Sie dieses Verhalten überschreiben und ein Asset zum Hochskalieren zwingen möchten, müssen Sie den Wert stretch explizit deklarieren.

Validierungsanforderungen für das Hochskalieren

Regel für zwei Größen: Der stretch Wert ist nur zulässig, wenn Sie sowohl die width als auch die height Parameter im Resize Vorgang explizit angeben.
Beschränkung für eine Dimension: Wenn Sie scaling=stretch angeben und nur eine Dimension definieren, z. B. width oder height, lehnt der Bildoptimierungs dienst die gesamte Anfrage ab.

Beispiel:

Gültige Anfrage: ?imop=resize,width=500,height=500,scaling=stretch

Ungültige Anfrage: ?imop=resize,width=500, scaling=stretch

Caching und Cacheentwertung

Wenn Sie ein Originalbild auf Ihrem Ursprungsserver aktualisieren, müssen Sie die im Cache gespeicherte Version entwerten, damit Cloud CDN das aktualisierte Asset abruft und bereitstellt.

Caching-Verhalten

Jede eindeutige Kombination von Transformationsparametern, die an eine Bild-URL angehängt wird, erstellt einen separaten, eindeutigen Cacheeintrag am Edge. Um die Cache-Trefferrate zu optimieren, sollten Sie nicht zu viele eindeutige Parameterkombinationen erstellen. Beispiel: Änderungen um ein einzelnes Pixel.

Cloud CDN normalisiert Cache-Schlüssel, um identische Transformationsparameter unabhängig von ihrer Reihenfolge im Abfragestring zu gruppieren.

Verhalten bei der Entwertung

Wenn Sie ein Originalbild auf Ihrem Ursprungsserver aktualisieren, müssen Sie nur eine einzige Entwertungsanfrage für die Basis-Bild-URL senden. Das erweiterte Cloud CDN löscht sowohl das im Cache gespeicherte Originalbild als auch alle automatisch generierten Varianten (z. B. WebP- oder optimierte Versionen) weltweit.

Funktionsweise der Entwertung von Varianten

Wenn Sie eine Cacheentwertungsanfrage mit einem Pfadmuster senden, das mit einer Basis-Bild-URL übereinstimmt,z. B. /images/my-picture.jpg, identifiziert und löscht Cloud CDN automatisch Folgendes:

Das im Cache gespeicherte Original-Quellbild.
Alle zuvor generierten Varianten.

Sie können die Cloud CDN-Cacheentwertung auf folgende Weise anwenden:

Google Google Cloud Cloud Console: Rufen Sie „Netzwerkdienste“ > Cloud CDN auf, wählen Sie den Ursprung aus und wechseln Sie zum Tab Cacheentwertung. Alternativ können Sie zu „Netzwerkdienste“ > „Load-Balancing“ wechseln, Ihren Load-Balancer auswählen und den Tab Cacheentwertung verwenden.
Google Cloud CLI: Verwenden Sie den Befehl Google Cloud CLI compute url-maps invalidate-cdn-cache.
Cache-Tags : Cache-Tags sind die empfohlene Methode zum Verwalten optimierter Bilder. So können Sie Entwertungsanfragen senden, die auf ein bestimmtes Tag ausgerichtet sind. Dadurch werden die damit verknüpften Inhalte gelöscht, was eine detailliertere Steuerung ermöglicht.

Beispiel:

So entwerten Sie /images/my-picture.jpg und alle optimierten Varianten weltweit:

Pfad: Geben Sie den genauen Pfad /images/my-picture.jpg an.
Host (optional): Geben Sie den Host an, wenn Sie das Bild nur für eine bestimmte Domain löschen möchten.

Wenn diese einzelne Aktion ausgeführt wird, werden alle optimierten Versionen des Bildes weltweit aus den Edge-Caches entfernt. So erhalten Nutzer bei der nächsten Anfrage sofort die aktualisierte Version.

Farbprofil und Bildausrichtung in EXIF (Normalisierung)

Moderne Smartphones und Digitalkameras speichern Bilder häufig mit ungedrehten Pixelrastern und verwenden ein eingebettetes EXIF-Ausrichtungstag, um das Anzeigegerät anzuweisen, das Bild zu drehen. Beispiel: 90 Grad im Uhrzeigersinn für die Hochformatausrichtung. Ebenso definieren eingebettete ICC-Farbprofile, wie Farben auf verschiedenen Monitoren angezeigt werden.

Um vorhersehbare Vorgänge zu gewährleisten, normalisiert die Edge-Pipeline für die Bildoptimierung Bilder automatisch, bevor Transformationen ausgeführt werden.

Normalisierungsprozess

Vor der Ausführung von Transformationen liest die Edge-Engine EXIF-Ausrichtungstags und ICC-Farbprofilmetadaten und wendet sie physisch auf das Pixelraster an. So wird die Vorhersagbarkeit der Koordinaten für nachfolgende crop- und resize-Parameter gewährleistet.
Vorgänge wie crop, resize oder scale werden korrekt auf die tatsächlichen visuellen Abmessungen angewendet, um visuelle Fehler zu vermeiden.
Nachdem die Anpassungen an den Kernpixeln vorgenommen wurden, entfernt die Edge-Engine alle nicht erforderlichen Metadaten aus der Datei, um die Dateigröße so weit wie möglich zu reduzieren. Standardmäßig wird copyright beibehalten, es sei denn, in einem Metadatenvorgang wird ein bestimmter Wert angefordert.