javascript - memory leak when using base64 images -


i'm creating extension similar speed dial form.
creates new tab page image thumbnails.
screenshot better understanding

those images read array of base64 datauri.
in html, have container div in i'm creating thumbnails array loop. i've been trying different approaches accomplish small(reasonable) memory usage, without of luck.

this 1

 chrome.storage.local.get('imgarray', function (result) {     var imgarray = result.imgarray;      var cnt = document.createelement('div');     cnt.id = 'contaier';     cnt.style.left = l+'px';     cnt.style.bottom = 0+'px';     cnt.style.width = l2+'px';     document.body.appendchild(cnt);       (var i=0, l=imgarray.length; i<l; i++) {         var sp = document.createelement('div');         sp.id = lv.id;         sp.classname = 'thumbnail';         cnt.appendchild(sp);         sp.setattribute("style", "background-image: url('" + imgarray[i].ss2 + "');");            /* other minor elements.... not important*/     }      imgarray=null; }); 

every time resize window, memory jumps in step of 10-20mb, , accumulates fast, can 400-500mb memory usage 20-25 small image previews.

i did played different img sizes upon creation of thumbnails, have images in approx. 1000x500px (imgarray[i].ss) , 500x250px (imgarray[i].ss2)
smaller images consume less memory (not much) still, mem. accumulation same...

another approach canvas, avoid bg-image:

for (var i=0, l=imgarray.length; i<l; i++) {     (function(lv) {         var sp = document.createelement('div');         sp.id = lv.id;         sp.classname = 'thumbnail';         cnt.appendchild(sp);          var canvas = document.createelement("canvas");         canvas.classname = 'stimg';          var ctx = canvas.getcontext("2d");           var img = new image;         img.onload = function(){           ctx.drawimage(img, 0, 0, canvas.width, canvas.height);         };         img.src = lv.ss2;                 sp.appendchild(canvas);           }(imgarray[i]));         } 

i tried img element too, inside thumbnail div. nulling original array helps little not real problem.
have use base64 images, , every redrawing of dom eats memory , never release it....

is there way keep memory usage low? or technique avoid redrawing (if actual problem in first place)...


Comments

Popular posts from this blog

asp.net mvc - SSO between MVCForum and Umbraco7 -

Python Tkinter keyboard using bind -

ubuntu - Selenium Node Not Connecting to Hub, Not Opening Port -