I am building a screen recorder extension for Google Chrome, it works as expected but I am deeply considered about the performance since it chucks data collected through screen sharing and microphone. I would love to get your feedback on how to test my code and how to know its limits through testing.this is the code and the full functional extension is attached 'use strict';//Define buttons of the appvar recBtn = document.querySelector('button#rec');var pauseResBtn = document.querySelector('button#pauseRes');var stopBtn = document.querySelector('button#stop');var videoElement = document.querySelector('video');var dataElement = document.querySelector('#data');var downloadLink = document.querySelector('a#downloadLink');videoElement.controls = false;var errorElement = document.querySelector('#errorMsg');var mediaRecorder;var chunks = [];var count = 0;//Desktop sharing optionconst DESKTOP_MEDIA = ['screen'];var pending_request_id = null;var mux_stream = new MediaStream();// Launch webkitGetUserMedia() based on selected media id.function onAccessApproved(id) {  if (!id) {    console.log('Access rejected.');    return;  }       var deviceId = null;  navigator.mediaDevices.enumerateDevices().then(function(deviceInfos){   for (var i = 0; i !== deviceInfos.length; ++i) {    var deviceInfo = deviceInfos[i];        if (deviceInfo.kind === 'audioinput') {        console.log(deviceInfo.deviceId);        navigator.mediaDevices.getUserMedia(        {            audio: {deviceId: deviceInfo.deviceId}        }).        then(handleSuccess).catch(handleError);          break;    }    }}).catch(handleError);  //record screen   navigator.mediaDevices.getUserMedia(  {    video: {      mandatory: {        chromeMediaSource: 'desktop',        chromeMediaSourceId: id,        maxWidth:screen.width,        maxHeight:screen.height} }  }).  then(handleSuccess).catch(handleError);  }$( #rec ).click(function() {     if (typeof MediaRecorder === 'undefined' || !navigator.getUserMedia) {        alert('MediaRecorder not supported on your browser, use Firefox 30 or Chrome 49 instead.');    }else {         //ask for desktop permissions        pending_request_id = chrome.desktopCapture.chooseDesktopMedia(          DESKTOP_MEDIA, onAccessApproved);        recBtn.disabled = true;        pauseResBtn.disabled = false;        stopBtn.disabled = false;    }});function handleSuccess(stream) {  console.log('Got Stream');  stream.oninactive = function() {    console.log('Stream inactive');  };  mux_stream.addTrack(stream.getTracks()[0]);    if(mux_stream.getTracks().length  == 2){    console.log(mux_stream.getTracks().length);    startRecording(mux_stream);    }}function handleError(error) {  if (error.name === 'ConstraintNotSatisfiedError') {    errorMsg('The resolution ' + constraints.video.width.exact + 'x' +        constraints.video.width.exact + ' px is not supported by your device.');  } else if (error.name === 'PermissionDeniedError') {    errorMsg('Permissions have not been granted to use your camera and ' +      'microphone, you need to allow the page access to your devices in ' +      'order for the demo to work.');  }  errorMsg('getUserMedia error: ' + error.name, error);}function errorMsg(msg, error) {  errorElement.innerHTML += '<p>' + msg + '</p>';  if (typeof error !== 'undefined') {    console.error(error);  }}function startRecording(stream) {    log('Start recording...');    if (typeof MediaRecorder.isTypeSupported == 'function'){        /*            MediaRecorder.isTypeSupported is a function announced in https://developers.google.com/web/updates/2016/01/mediarecorder and later introduced in the MediaRecorder API spec http://www.w3.org/TR/mediastream-recording/        */        if (MediaRecorder.isTypeSupported('video/webm;codecs=h264')) {          var options = {mimeType: 'video/webm;codecs=h264'};        } else if (MediaRecorder.isTypeSupported('video/webm;codecs=vp9')) {          var options = {mimeType: 'video/webm;codecs=vp9'};        } else if (MediaRecorder.isTypeSupported('video/webm;codecs=vp8')) {          var options = {mimeType: 'video/webm;codecs=vp8'};        }        log('Using '+options.mimeType);        mediaRecorder = new MediaRecorder(stream, options);    }else{        log('Using default codecs for browser');        mediaRecorder = new MediaRecorder(stream);    }    pauseResBtn.textContent = Pause;    mediaRecorder.start(10);    //var url = window.URL || window.webkitURL;    //videoElement.src = url ? url.createObjectURL(stream) : stream;    //videoElement.play();    mediaRecorder.ondataavailable = function(e) {        //log('Data available...');        //console.log(e.data);        //console.log(e.data.type);        //console.log(e);        chunks.push(e.data);    };    mediaRecorder.onerror = function(e){        log('Error: ' + e);        console.log('Error: ', e);    };    mediaRecorder.onstart = function(){        log('Started & state = ' + mediaRecorder.state);    };    mediaRecorder.onstop = function(){        log('Stopped  & state = ' + mediaRecorder.state);        var blob = new Blob(chunks, {type: video/webm});        chunks = [];        var videoURL = window.URL.createObjectURL(blob);        downloadLink.href = videoURL;        videoElement.src = videoURL;        downloadLink.innerHTML = 'Download video file';        var rand =  Math.floor((Math.random() * 10000000));        var name  = video_+rand+.webm ;        downloadLink.setAttribute( download, name);        downloadLink.setAttribute( name, name);    };    mediaRecorder.onpause = function(){        log('Paused & state = ' + mediaRecorder.state);    }    mediaRecorder.onresume = function(){        log('Resumed  & state = ' + mediaRecorder.state);    }    mediaRecorder.onwarning = function(e){        log('Warning: ' + e);    };}$( #stop ).click(function() {    mediaRecorder.stop();    videoElement.controls = true;    recBtn.disabled = false;    pauseResBtn.disabled = true;    stopBtn.disabled = true;});$( #pauseRes ).click(function() {    if(pauseResBtn.textContent === Pause){        console.log(pause);        pauseResBtn.textContent = Resume;        mediaRecorder.pause();        stopBtn.disabled = true;    }else{        console.log(resume);        pauseResBtn.textContent = Pause;        mediaRecorder.resume();        stopBtn.disabled = false;    }    recBtn.disabled = true;    pauseResBtn.disabled = false;});function log(message){    dataElement.innerHTML = dataElement.innerHTML+'<br>'+message ;}
WebRTC screen recording plugin performance testing
javascript;performance;google chrome