HTMLImageElement: decode() Methode
Baseline
Weitgehend verfügbar
Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit Januar 2020 browserübergreifend verfügbar.
Die decode() Methode des HTMLImageElement Interfaces gibt ein Promise zurück, das aufgelöst wird, sobald das Bild decodiert ist und sicher an das DOM angehängt werden kann.
Dies kann verwendet werden, um das Laden des Bildes zu initiieren, bevor es an ein Element im DOM angehängt wird (oder es als neues Element zum DOM hinzugefügt wird), sodass das Bild sofort beim Hinzufügen zum DOM gerendert werden kann. Dies verhindert, dass das Rendern des nächsten Frames nach dem Hinzufügen des Bildes zum DOM eine Verzögerung verursacht, während das Bild geladen wird.
Syntax
decode()
Parameter
Keine.
Rückgabewert
Ein Promise, das mit undefined erfüllt wird, sobald die Bilddaten zur Verwendung bereit sind.
Ausnahmen
EncodingErrorDOMException-
Ein Fehler ist beim Decodieren des Bildes aufgetreten. Dies kann passieren, wenn:
- Die Anfrage fehlgeschlagen ist
- Die Bildanfrage nach dem Aufruf von
decode()geändert wurde (zum Beispiel durch Ändern vonsrc) - Die Bilddaten beschädigt sind
Beispiele
Grundlegende Nutzung
Das folgende Beispiel zeigt, wie Sie die decode() Methode verwenden, um zu steuern, wann ein Bild an das DOM angehängt wird.
const img = new Image();
img.src = "nebula.jpg";
img
.decode()
.then(() => {
document.body.appendChild(img);
})
.catch((encodingError) => {
// Do something with the error.
});