WinJS Low Memory issue with ZXing

Question

I am creating a Barcode scanner module for Windows 8 Metro App.

I some how success with my logic but suddenly I saw my application crash due to low memory issue.

<script>
        var canvas = null;
        var ctx = null;
        var livePreview = null;
        var count = 0,rescount=0;
        function takepicture() {
            var Capture = Windows.Media.Capture;
             livePreview = document.getElementById("live-preview");
            var mediaCapture = new Capture.MediaCapture();
            canvas = document.getElementById("Vcanvas");
           ctx=canvas.getContext('2d');



           livePreview.addEventListener('play', function () { var i = window.setInterval(function () { ctx.drawImage(livePreview, 0, 0, canvas.width, canvas.height); scanCanvasEasy(); }, 20); }, false);
            livePreview.addEventListener('pause', function () { window.clearInterval(i); }, false);
            livePreview.addEventListener('ended', function () { clearInterval(i); }, false);

            /*
            var openPicker = new Windows.Storage.Pickers.FileOpenPicker();
            openPicker.viewMode = Windows.Storage.Pickers.PickerViewMode.thumbnail;
            openPicker.suggestedStartLocation = Windows.Storage.Pickers.PickerLocationId.videosLibrary;
            openPicker.fileTypeFilter.replaceAll([".mp4", ".avi", ".ogg"]);
            openPicker.pickSingleFileAsync()
            .then(function (file) {
                if (file) {
                    // draw the image
                    var img = new Image;
                    //img.onload = function () {
                    //    canvas.width = img.width;
                    //    canvas.height = img.height;
                    //    ctx.drawImage(img, 0, 0, img.width, img.height);
                    //    scanCanvasEasy();
                    //}
                    //img.src = URL.createObjectURL(file);
                    // open a stream from the image
                    livePreview.src = URL.createObjectURL(file);
                    livePreview.play();

                }
            })*/
            mediaCapture.initializeAsync().then(function () {

                livePreview.src = URL.createObjectURL(mediaCapture);
                livePreview.play();
            });
        }



        function scanCanvasEasy() {
            var imgd = ctx.getImageData(0, 0,canvas.width,canvas.height);
            var pix = imgd.data;
            var reader = new ZXing.BarcodeReader();
            reader.onresultpointfound = function (resultPoint) {
                // do something with the resultpoint location
                console.log(resultPoint.toString());
            }
            // try to decode the raw pixel data
            var result = reader.decode(pix, canvas.width, canvas.height, ZXing.BitmapFormat.rgba32);
            /*

            The above line cause that memory issue, without that line there is no change in memory level.
            */


            // show the result
            if (result) {
                document.getElementById("result").innerText ="Result(+"+rescount++ +")==>"+ result.text;
            }
            else {
                document.getElementById("error").innerText = "no barcode found" + count++;
            }
      }
      </script>

I posted the whole code i used here I Just called the takepicture() method from button click event.

 var result = reader.decode(pix, canvas.width, canvas.height, ZXing.BitmapFormat.rgba32);

This line cause memory issue.

Thanks in advance.

Answer 1

 var reader = new ZXing.BarcodeReader();

Multiple instance of reader cause this issue. Just created one instance of reader and use it for all subsequent scan will fixed that issue.