0

I been using JavaScript to code a chroma key program but it's running very slow and lagging. Below is the code snippet that I believe is causing the problem. Is there any way to make this more efficient?

 l= data.length/4;
    while(l--){
        r= data[l*4];
        g= data[l*4+1];
        b= data[l*4+2];

        if(Math.abs(r - colors[0]) < 250 - range
           &&
           Math.abs(g - colors[1]) < 250 - range
           &&
           Math.abs(b - colors[2]) < 250 - range)
        {
            frame.data[l*4+3]= 0;
        }
    }
    ctxV.putImageData(frame, 0, 0);

    frame = null;
    data = null;
    l=null;
    r=null;
    g=null;
    b=null;
    delete frame;
    delete data;
    delete l;
    delete r;
    delete g;
    delete b;
    //

};
vdgoran
  • 11
  • 1
  • Don't use clientside for such heavy functionality. imo, JS is not the way to go with ChromaKey. Apart from that - i don't think there is a lot to change. How many loops does it go on avg? – Mike B Apr 23 '16 at 19:54
  • It is just very slow and lags. I also don't believe there is much to chance. Do you feel this is the most efficient implementation> – vdgoran Apr 23 '16 at 20:17
  • Only thing i can think of - you could parse `r, g, b` to int and exclude Math.abs() as Math functions are usually pretty costly (don't know for sure actually if this one is). – Mike B Apr 23 '16 at 20:25
  • I found [this](http://examples.hmp.is.it/chromakeycanvas.php). Check this demo. In source both JS files are accessible so you can just check that code. – Mike B Apr 23 '16 at 20:25
  • Where are he JS files for the demo? – vdgoran Apr 23 '16 at 21:23
  • nm found it seems to be doing same thing though – vdgoran Apr 23 '16 at 21:27

0 Answers0