Почему Firefox создает большие видеофайлы WebM по сравнению с Chrome? - PullRequest
Новая
       101

Почему Firefox создает большие видеофайлы WebM по сравнению с Chrome?

0 голосов
/ 12 февраля 2019

Я и моя команда в последнее время изо всех сил пытались найти объяснение, почему Firefox создает большие видеофайлы WebM / VP8 по сравнению с Chrome при использовании MediaRecorder API в нашем проекте.

Короче говоря, мы записываем MediaStream из HTMLCanvas методом captureStream.В попытке изолировать все от нашего приложения, которое может повлиять на это, я разработал небольшое специальное тестовое приложение, которое записывает <canvas> и создает файлы WebM.Я проводил тесты с одинаковыми кадрами, длительностью видео, кодеком, A / V битрейтом и частотой кадров.Тем не менее, Firefox по-прежнему создает файлы в 4 раза больше по сравнению с Chrome.Я также пытался использовать другой источник MediaStream, например, веб-камеру, но результаты были похожи.

Вот скрипка, которая должна продемонстрировать, о чем я говорю: https://jsfiddle.net/nzwasv8k/1/ https://jsfiddle.net/f2upgs8j/3/. Вы можете попробовать записать видео продолжительностью 10 или 20 секунд на FF и Chrome и заметить разницу между размерами файлов. Обратите внимание, что в этой демонстрации я использую только 4 относительно простых кадра / изображения. При использовании в реальных условиях, например, в нашем приложении, где мы записываем видеопоток с рабочего стола, мы достигли ошеломительной 9-кратной разницы.

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

1 Ответ

0 голосов
/ 12 февраля 2019

Поскольку они не используют одни и те же настройки ...

У веб-кодировщика есть много других параметров , чем те, к которым мы получили доступ из MediaRecorder.

Все эти параметры могут влиять на размер выходного файла и могут устанавливаться разработчиками.

Вот снимки, которые я сделал из видео, сгенерированных из вашего обновленногоскрипка [щелкнуть для увеличения]:

Chrome 1 image Firefox 1 image
Chrome 2 image Firefox 2 image

Надеюсь, вы сможете оценить разницу в качестве, она примерно такая же, как между параметрами качества webp 0.15 против 0.8, и размеры также отражают эти изменения.

const supportWebPExport = document.createElement('canvas').toDataURL('image/webp').indexOf('webp') > -1;
const mime = supportWebPExport ? 'image/webp' : 'image/jpeg';

const img = new Image();
img.onload = doit;
img.crossOrigin = 'anonymous';
img.src = "https://i.imgur.com/gwytj0N.jpg";

function doit() {
 const canvas = document.createElement('canvas');
 const ctx = canvas.getContext('2d');
 canvas.width = this.width,
 canvas.height = this.height;
 ctx.drawImage(this, 0,0);
 
 canvas.toBlob(b => appendToDoc(b, '0.15'), mime, 0.15);
 canvas.toBlob(b => appendToDoc(b, '0.8'),mime, 0.8);
}

function appendToDoc(blob, qual) {
  const p = document.createElement('p');
  p.textContent = `quality: ${qual} size: ${blob.size/1000}kb`;
  p.appendChild(new Image).src = URL.createObjectURL(blob);
  document.body.appendChild(p);
}

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

...