メニューを表示

decoding 属性画像デコードのヒントを提供

decoding 属性は、ユーザエージェントに画像デコードのヒントを提供します。

画像を同期的にデコードするよう指定すると、ユーザエージェントは読み込んだ順番で画像をデコードしていくため、続くコンテンツの表示がそれを待つ間、遅れる可能性があります。非同期的にデコードするよう指定することで、対応するブラウザではこの問題を回避できます。

例えば文書内で補足的に使われていたり、本文とあまり関係がない画像など、それ程重要ではない画像に指定して、Webページが表示される体感速度を向上させることが可能です。

decoding 属性に指定できる値

属性値 概要
sync 他のコンテンツと画像を同期的にデコードします。
async 他のコンテンツと画像を非同期的にデコードします。
auto デフォルト値。デコード方式を指定しません。

参考

現時点ではまだ Google Chrome の独自実装ですが、loading 属性という属性が画像(img 要素)や iframe 要素の遅延読み込みに使用できる属性が提案されています。decoding 属性は、ユーザエージェントに取得した画像をデコードするタイミングを指示しますが、loading 属性は画像の取得タイミング自体を指定します。

decoding 属性の仕様

この属性を使用できる要素

このページの上部へ