HTMLImageElement: decode() メソッド

なし。

画像データが利用できるようになったときに解決される Promise です。

EncodingError

画像のデコード中にエラーが発生したことを示す DOMException です。

decode() の潜在的な使用例の一つです。非常に大きな画像を読み込む場合（例えばオンラインのフォトアルバムで）、最初は低解像度のサムネイル画像を表示し、その後、新しい HTMLImageElement をインスタンス化してそのソースにフル解像度画像の URL を設定し、decode() を使ってプロミスを取得し、フル解像度画像が使えるようになったときに解決することによって、画像をフル解像度画像と交換することが可能です。その際、低解像度の画像を、現在利用可能なフル解像度の画像に置き換えることができます。

次の例では、 decode() メソッドを使って、画像が DOM に追加されるタイミングを制御しています。 Promise を返すメソッドがなければ、 load イベントハンドラーで画像を DOM に追加し、 img.onload イベントのハンドラでエラーを処理するなどの方法で、画像を追加することになります。

const img = new Image();
img.src = "nebula.jpg";
img
  .decode()
  .then(() => {
    document.body.appendChild(img);
  })
  .catch((encodingError) => {
    // エラー時に何かをする。
  });