video - electron streaming screenshare - delay to display initial image, then not updating image -

i'm working example found in electron docs on desktopcapturer. works fine if use stream directly, in streamsource function below.

but if try set web server , send stream data through server, things start break down. initial screen image shows after 10 seconds. , never updates after first image, though can see data being sent/received.

as said, see data transmissions, both console.log() , in network pane of dev tools.

i've tried using mediasource.addsourcebuffer() receive stream, errors on appendbuffer(). if that's direction need go, can post code.

it's using vp8 codec (streamed data file , verified codec vlc).

here main script:

const {remote, desktopcapturer} = require('electron'); const websrv = require('./websrv');  desktopcapturer.getsources({types: ['window', 'screen']}, (error, sources) => {     if (error) throw error      if(sources.length==0) return;     navigator.mediadevices.getusermedia({         audio: false,         video: {             mandatory: {                 chromemediasource: 'desktop',                 chromemediasourceid: sources[0].id,                 maxwidth: 500, maxheight: 500, maxframerate: 4             }         }     }).then(upstream);     return; });  function upstream(stream) {     var mr = new mediarecorder(stream);     mr.ondataavailable = function(e) {         websrv.putblob(e.data);     };     mr.start(200);     document.queryselector('video') = 'http://localhost:'+websrv.port; }  // direct streaming method works, reference function streamsource(stream) {     document.queryselector('video') = url.createobjecturl(stream); } 

and here websrv.js:

const http = require('http'); const port = 8964;  let listeners = [];  let putbuf = function(buf) {     console.log(`${buf.length} bytes of data, ${listeners.length} listeners`);       for(var i=0;i<listeners.length;i++) {         var res = listeners[i];         res.write(buf);     } };  let putblob = function(blob) {     var reader = new filereader();     reader.onload = function() {         var buf = buffer.from(reader.result);         putbuf(buf);     };     reader.readasarraybuffer(blob); };  let server = http.createserver(function (req, res) {     res.writehead(200, {          'content-type': 'video/webm' });     listeners.push(res); }); server.listen(port);  module.exports = {     port: port,     putblob: putblob };