Можно ли предварительно загрузить несколько видео ресурсов для загрузки в один и тот же элемент HTML5 <video>?

Question

Я прорабатываю детали веб-приложения, которое включает последовательную загрузку длинных серий (очень коротких) видеоклипов, один за другим, с периодическим вводом от пользователя, определяющим новые направления, для которых видеоклипы загружать ,

Я бы хотел, чтобы браузер предварительно загружал видеоклипы по пять одновременно. Тем не менее, способ, которым у нас в настоящее время работает сайт, заключается в использовании одного видеоэлемента, атрибут которого src которого постоянно обновляется с помощью JavaScript.

Есть ли простой способ заставить браузер предварительно загружать несколько видеоклипов, даже если я в конечном итоге загружаю их все (по одному за раз) в один и тот же элемент видео?

Answer 1

Вы можете предварительно загрузить изображения в браузерах, создав тег <img> в JavaScript и установив его атрибут src. Хотя это не требуется ни для одной спецификации, все браузеры затем загружают изображение и кэшируют его (при условии, что их кэши не отключены).

Я не знаю, работает ли это с элементом <video> в HTML5, но это может сработать. Не могли бы вы попробовать?

Answer 2

Мне было любопытно, закончил ли ты проект, над которым работал? Я экспериментировал с html5-видеоплеером со списком воспроизведения и мне было интересно, столкнулись ли вы с какими-либо большими проблемами. Были ли проблемы с производительностью при загрузке / воспроизведении нескольких видеофайлов? Вы смогли запустить это на iPad? У вас был запасной вариант для IE?

Мой подход был следующим: иметь один элемент <canvas> с несколькими скрытыми элементами <video> и использовать функцию canvas drawImage () для отображения и плавного перехода между видео.