HTMLMediaElement : propriété loading

Disponibilité limitée

Cette fonctionnalité n'est pas Compatible car elle ne fonctionne pas dans certains des navigateurs les plus utilisés.

Expérimental: Il s'agit d'une technologie expérimentale.
Vérifiez attentivement le tableau de compatibilité des navigateurs avant de l'utiliser en production.

La propriété loading de l'interface HTMLMediaElement fournit un indice au navigateur sur la manière de gérer le chargement des médias qui se trouvent actuellement en dehors de la zone d'affichage visuel de la fenêtre. Cela permet d'optimiser le chargement du contenu du document en reportant le chargement des médias jusqu'à ce qu'ils soient réellement nécessaires, plutôt que de les charger immédiatement lors du chargement initial de la page. Elle reflète l'attribut de contenu loading de l'élément <audio> ou l'attribut de contenu loading de l'élément <video>.

function ajouterVideoDansListe(url) {
  const liste = document.querySelector("div.video-list");

  const nouvelObjet = document.createElement("div");
  nouvelObjet.className = "video-item";

  const nouvelleVideo = document.createElement("video");

  // Chargement paresseux si pris en charge
  if ("loading" in HTMLVideoElement.prototype) {
    nouvelleVideo.loading = "lazy";
  } else {
    // Si le chargement paresseux natif n'est pas pris en charge, vous
    // pouvez envisager des alternatives, bien que cela puisse convenir
    // comme amélioration progressive.
  }

  nouvelleVideo.width = 320;
  nouvelleVideo.height = 240;
  nouvelleVideo.src = url;

  nouvelObjet.appendChild(nouvelleVideo);
  liste.appendChild(nouvelObjet);
}