WebRTC Reduce Video Recording Size

Question

I recorded a video for 10 seconds in (Firefox / Chrome) using this example https://www.webrtc-experiment.com/RecordRTC/ . The recorded blob size around [10 sec., 4.36MB (320x240)]. Then I changed some parameter as vapor

var videoConstraints = {
    audio: false,
    video: {
        mandatory: {
            width: { min: 320 },
            height: { min: 240 }
        },
        optional: [
            { width: 320 },
            { width: 
                { min: 320 }
            },
            { frameRate: 60 },
            { quality: 10 },
            { width: 
                { max: 320 }
            },
            { facingMode: "user" }
        ]
    }
};

But the drop size is almost the same. what can I do to reduce the size of the recorded blob.

Answer 1

@jib / . , , , MediaRecorder. , MediaRecorder (Firefox ). Firefox Firefox OS, ).

Answer 2

Chrome .

(- polyfill Chrome):

var constraints = {
  video: {
    width: { min: 320 },
    height: { min: 240 },
    advanced: [
       { width: 320 },
       { width: { min: 320 } },
       { frameRate: 60 },
       { width: { max: 320 } },
       { facingMode: "user" }
    ]
  }
};

, /:

var constraints = {
  video: {
    width: { min: 320, ideal: 320 },
    height: { min: 240 },
    frameRate: 60,
    facingMode: "user",
  }
};

, , min. min max , min , , . ideal max.

, Chrome, , , polyfill:

var constraints = {
  video: {
    width: { min: 320, ideal: 320 },
    height: { min: 240 },
    frameRate: 60,
    facingMode: "user",
  }
};

function start() {
  navigator.mediaDevices.getUserMedia(constraints)
  .then(function(stream) { v.srcObject = stream; })
  .then(function() {
    return new Promise(function(r) { v.onloadedmetadata = r;});
  })
  .then(function() {
    log("Success: "+ v.videoWidth +"x"+ v.videoHeight);
  })
  .catch(failed);
}

function log(msg) { div.innerHTML += "<p>" + msg + "</p>"; }
function failed(e) { log(e + ", line " + e.lineNumber); }

<video id="v" height="120" width="160" autoplay></video><br>
<button onclick="start()">Start!</button><div id="div"></div>
<script src="https://rawgit.com/webrtc/adapter/master/adapter.js"></script>

Hide result

quality .