Ошибка при воспроизведении html5 video

174

02 апреля 2019, 19:00

Возникла некая проблема при загрузке видео html5: Вставил на страницу 8 видео html5 - тегом, идущих один за другим ( видео не большие, по 15 сек. ). Так вот, в браузере на десктопе все норм грузит, но вот на мобильных устройствах все жутко тормозит, ( появление ошибки "aw snap!", белый экран, вылетает браузер и тд. ) в общем не показывает видео. Такое ощущение, что не хватает железа. Уменьшил количество видео до 3 - ничего не вылетает.

Отсюда и вопрос, как можно выйти из данной ситуации? Если это реально. Может кто сталкивался?

Вот код вставки видео если что: ( таких 8 штук, только урл разный )

<video width="100%" height="auto" controls="true" preload="metadata">
  <source src="visionaire-8.mp4" type="video/mp4"><source src="visionaire-8.webm" type="video/webm">
Your browser does not support the video tag.
</video>

Answer 1

Предлагаю сделать через ajax, т.е. у тебя есть страница с 3 видео, и при скроллинге добавляются новые видео

<div class="cat">
<div class="media">
    <script>
        $(".cat").on("touchmove", scrolling);
        var count = 4;
        var begin = 0;
        videoitem();
        function scrolling() {
            videoitem();
        }
        function videoitem() {
            $.ajax({
                async: true,
                type: 'POST',
                url: 'video.php',
                data: {
                    count: count,
                    begin: begin * count
                },
                success: onAjaxSuccess
            });
            function onAjaxSuccess(data) {
                $(".media").append(data);
            }
            begin++;
        }
    </script>
</div>
</div>

Answer 2

Точно не помню но у браузеров есть лимит на "preload" видео, соответственно на телефонах он меньше чем на пк.

Как вариант всем поставить вместо preload="metadata" =>

preload="none" и добавить poster="src"

ну или первому оставить preload="metadata", а остальным none

Answer 3

Вышел из ситуации просто показом видео в попапе, так не происходит инициализация многих плееров одновременно