CODEWITHSUNDEEP
javascriptwebrtcgetusermedia
Kudos
Kudos

Reputation: 375

getUserMedia/RecordRTC performance issue at 720p

I am using the RecordRTC script for recording video/Audio.

Everything is fine until I require 720p.

If you visit the RecordRTC site and choose 1280x720 for both video and canvas options you'll notice considerable slow down when compared to smaller sizes (expected).

if I record ONLY video it works perfectly but I require both.

$('.btn.record').on('click',function() {
!window.stream && navigator.getUserMedia(
  {
    audio: true,
    video: {
      optional: [],
      mandatory: {
        minWidth: 1280,
        minHeight: 720,
        maxWidth: 1280,
        maxHeight: 720,
        minAspectRatio: 1.7777777778,
        maxAspectRatio: 1.7777777778,
      }
    }
  },
  function(stream) {
    window.stream = stream;
    onstream();
  },
  function(error) {
    alert(error);
  }
);

window.stream && onstream();

function onstream() {
    preview.src = window.URL.createObjectURL(stream);
    preview.play();
    preview.muted = true;

    recordAudio = RecordRTC(stream, {
        onAudioProcessStarted: function() {
            if(!isFirefox) {
                recordVideo.startRecording();
            }
        }
    });

    recordVideo = RecordRTC(stream, {
        type: 'video',
        video: {
          width: 1280,
          height: 720
        },
        canvas: {
          width: 1280,
          height: 720
        }
    });

    recordAudio.startRecording(); // DISABLE THIS AND VIDEO IS PERFECT
}

Upvotes: 0

Views: 1157

Answers (1)

Muaz Khan
Muaz Khan

Reputation: 7236

Use <canvas> width/height as low as possible; 320*240 are suggested values:

recordVideo = RecordRTC(stream, {
    type: 'video',
    video: {
        width: 1280, // redundant because offsetWidth/videoWidth   will be 1280
        height: 720  // redundant because offsetHeight/videoHeight will be 720
    },
    canvas: {
        width: 320,   // suggested width
        height: 240   // suggested height
    }
});

Upvotes: 1

Related Questions