decoding HTML attribuut
1 element kent dit attribuut. Klik op een tag voor de volledige uitleg van dat element.
Wat doet het decoding attribuut?
Geeft de browser een hint over hoe een afbeelding gedecodeerd moet worden: "sync", "async" of "auto" (standaard). Met "async" kan de browser de rest van de pagina tonen zonder te wachten op decodering van de afbeelding.
<img src="foto.jpg" alt="Beschrijving van de foto" decoding="async">Welke HTML-elementen kennen decoding?
<img>
Het <img>-element van HTML bettet een afbeelding in het document in.
Dit attribuut geeft de browser een hint of hij het decoderen van de afbeelding moet uitvoeren samen met het weergeven van de overige DOM-inhoud, in één presentatiestap die er "correcter" uitziet (sync), of dat hij eerst de overige DOM-inhoud rendert en presenteert en de afbeelding pas later decodeert en toont (async). In de praktijk betekent async dat de volgende paint niet wacht tot de afbeelding is gedecodeerd.
Het is vaak lastig om een merkbaar effect waar te nemen bij het gebruik van decoding op statische <img>-elementen. Ze worden waarschijnlijk aanvankelijk weergegeven als lege afbeeldingen terwijl de afbeeldingsbestanden worden opgehaald (hetzij van het netwerk, hetzij uit de cache), en vervolgens toch onafhankelijk afgehandeld, waardoor de "synchronisatie" van inhoudsupdates minder merkbaar is. Toch kan het blokkeren van rendering tijdens het decoderen, hoewel vaak vrij klein, worden gemeten — zelfs als het moeilijk is om met het blote oog waar te nemen. Zie What does the image decoding attribute actually do? voor een gedetailleerdere analyse (tunetheweb.com, 2023).
Het gebruik van verschillende decoding-typen kan resulteren in meer merkbare verschillen bij het dynamisch invoegen van <img>-elementen in de DOM via JavaScript — zie HTMLImageElement.decoding voor meer details.
Toegestane waarden:
sync- : Decodeer de afbeelding synchroon samen met het weergeven van de overige DOM-inhoud, en presenteer alles samen.
async- : Decodeer de afbeelding asynchroon, na het weergeven en presenteren van de overige DOM-inhoud.
auto- : Geen voorkeur voor de decodeermodus; de browser bepaalt wat het beste is voor de gebruiker. Dit is de standaardwaarde.