Comment puis-je arrêter la précharge d'une vidéo (HTML5 - Javascript)

Question

J'ai une page web avec un lecteur vidéo préchargeant 3 vidéos (basse, med, et haute qualité de la même vidéo). Ensuite, lorsque l'utilisateur clique sur l'un des boutons correspondant à la version souhaitée, la vidéo s'ouvre.

Ce que je voudrais faire est alors d'arrêter le préchargement des deux autres vidéos.

Est-ce possible? En d'autres termes, l'attribut "preload" de la balise HTML5 Video peut-il être annulé ou arrêté à la volée avec du Javascript?

Answer 1

Avec jQuery, vous pouvez essayer:

$('#videoPlayerId').removeAttr('preload'); 

Je ne sais pas qu'il arrêtera une vidéo qui est déjà préchargement.

Du point de vue de l'interface utilisateur, pourquoi essayez-vous de précharger les 3 vidéos en même temps? Cela ralentira la vitesse de chargement de tous les trois; Si vous préchargez seulement l'un d'entre eux, plus de la vidéo aura une chance de mettre en mémoire tampon avant que l'utilisateur commence à le voir.

Je suggère de précharger l'une des vidéos d'une qualité par défaut et de ne charger qu'une vidéo de qualité différente si l'utilisateur la sélectionne. C'est le comportement utilisé par YouTube, Netflix et d'autres.

Answer 2

Je viens de trouver une solution à un problème qui me ressemble. Je précharge une liste de films sur ma page, en série, mais je dois pouvoir passer à l'un d'entre eux et prioriser celui-ci avant tout ce qui aurait déjà pu être un préchargement, afin de le jouer le plus rapidement possible.

J'ai un élément de pré-tampon div # qui contient les vidéos préchargées, car elles sont mises en mémoire tampon. Quand je dois oublier préchargement, je fais simplement ceci:

var $video = $('#prebuffer video:last'); 
$video.find('source').attr('src', ''); 
$video[0].load(); 
// it has now stopped preloading. 
// and then, because I don't want this half-loaded broken cruft hanging around: 
$video.remove(); 

Il est un peu moche, mais je ne pouvais pas trouver un moyen plus agréable. Et ça fait le travail.

Answer 3

Il est dédié aujourd'hui tag:

<video preload="none" ....>