H5 的getImageData造成的大量内存开销

//多线程,使用多线程处理会导致内存飙升，最终导致页面崩溃
function removeColor() {
    var offScreenCanvas = offScreenContext.canvas;
    removeColorWorker.postMessage(offScreenContext.getImageData(0, 0, offScreenCanvas.width, offScreenCanvas.height));//报错在此行
    removeColorWorker.onmessage = receiveFromWorker;
}

function receiveFromWorker(e){
    offScreenContext.putImageData(event.data, 0, 0);
    mContext.drawImage(offScreenContext.canvas, 0, 0);
    requestNextAnimationFrame(onNextFrame);
}
//单线程,同样会占用大量内存，有时候可能会崩溃
function removeColor(){
    var imageData  = offScreenContext.getImageData(0,0,offScreenContext.canvas.width,offScreenContext.canvas.height),//报错在此行
        data = imageData.data,
        length = data.length;
    for(var i=0;i<length-4;i+=4){
        var average = (data[i]+data[i+1]+data[i+2])/3;
        data[i]= average;
        data[i+1] = average;
        data[i+2] = average;
    }
    offScreenContext.putImageData(imageData,0,0);
}

 正在寻求好的解决方式

此外还有一个问题，就是视频播放完毕之后，程序占用的内存并不会得到释放，证明仍然是离屏canvas在占据内存空间，得处理一下