Как избежать повторной перезагрузки HTML-видео на одной странице?

Использование одного и того же видео дважды на одной и той же странице приводит к перезагрузке ненужных носителей.

Сравните загрузку видео для загрузки изображения:

<img src="image.png"/>
<img src="image.png"/>
<video src="video.webm"></video>
<video src="video.webm"></video>

В соответствии с веб-консолью Firefox 5 это загружает изображение один раз, но видео дважды.

Я понимаю из http://www.w3.org/TR/html5/video.html#dom-media-mediagroup, что авторы spec ожидали одной перезагрузки в обоих случаях ( "Несколько элементов мультимедиа, ссылающихся на один и тот же медиаресурс, будут обмениваться одним сетевым запросом" ), но это не происходит со мной.

Я попытался поиграть с параметрами кеша сервера (я использую vanilla web.py), безрезультатно, и я подозреваю, что лаем на неправильном дереве. Есть ли что-то конкретное, на что я должен смотреть? HTML-мета-элементы?

Обратите внимание, что это противоречит распространенным проблемам с наличием нескольких источников для одного и того же видео. Здесь я обеспокоен наличием нескольких видеоэлементов с одним и тем же источником, играющим бок о бок (например, в разные моменты времени).

Ответ 1

Если вы проверяете размер загруженного видео, они оба загружают полное видео?

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

В июне я провел несколько тестов с помощью Брюса Лоусона, и мы обнаружили, что некоторые браузеры выполняют еще больше нагрузок, чем те, которые я описал выше.

HTML 5 Видео в реальной жизни (тесты)

Ответ 2

Если вы используете Html 5, то лучше вы можете пойти с Canvas. Он будет загружать видео один раз.

Ответ 3

Эта работа:

<video id="video" class="videohtml5" width="720" height="500" controls="controls" preload="auto" poster="">  
      <source src="path(1)"  />  
      <source src="path(2)" />  
      <source src="path(3)"  />  
</video>

Ответ 4

Я думаю, что люди неправильно читают спецификацию здесь.

Если вы посмотрите на пример в спецификации, они специально говорят об одном ресурсе (файле), который содержит несколько дорожек. Два видеоэлемента содержат ссылку на один и тот же файл, но разные дорожки в этом файле. Затем две дорожки воспроизводятся синхронно с помощью медиагруппы.

Если у вас есть два видео-тега, которые ссылаются на один и тот же файл с одним и тем же треком, я бы не ожидал, что они будут синхронизироваться по умолчанию. Я мог представить, что, указав их в одной и той же группе средств массовой информации, это может быть достигнуто и поэтому позволяет обоим элементам использовать одно соединение с одним потоком запросов.

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

Представьте себе, имеют ли два элемента разные элементы управления. Вы останавливаете первое видео и оставляете второе видео. Прошло 30 минут, и вы перезапустили первое видео. Браузер просто не собирается кэшировать то, что может составлять более ста мегабайт контента с сервера, чтобы позволить ему воспроизводить первое видео без запроса нового запроса на сервер.

Если вы ожидаете отправки двух отдельных потоков потокового контента по одному соединению с использованием HTTP, я не думаю, что это возможно (ну, в настоящее время реализовано). Это будет мультиплексирование, и в последний раз, когда я проверял, серверы HTTP не поддерживают мультиплексирование. Обратите внимание, что это отличается от поддерживаемого соединения, когда несколько частей контента обслуживаются поочередно, что мультиплексирование описывает несколько параллельных частей контента. Обычный способ добиться этого - просто открыть два сокета, что намного проще, чем для клиента, так и для сервера, чем попытка демонстрации одного потока.

Ответ 5

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

Ответ 6

Похоже, что это ошибка в браузере, который вы используете, поскольку он, по-видимому, не придерживается спецификации W3C HTML 5. Я бы порекомендовал вам подать отчет об ошибках для этих разработчиков браузера и проверить, как это поведение сравнивается с другими браузерами.