javascript - Very high processing difference between two almost similar while loops -

i'm writing function draws image canvas element pixel pixel. noticed there point, function took way longer process before - going 338x338 pixel canvas 339x339 pixel canvas.

putting similar looking function jsfiddle, same result. while loop processing array of 338x338 takes approx. 6-7 seconds, while array of 339x339 takes approx. 24-25 seconds.

this happening on chrome. in firefox both takes approx. 16 seconds.

here fiddle: http://jsfiddle.net/8pb89/5/

the code looks this:

var ary1 = []; var ary2 = []; var mapdata = {}; var colormatrix = {};  (var = 0; < (338 * 338); i++) {     ary1.push([i, + 2]); }  (var = 0; < (339 * 339); i++) {     ary2.push([i, + 2]); }  //light operation function test(i, j) {     return math.floor((i * j + + j) / j); }  //heavy operation on objects function calctest(ary){     var point = ary.splice(0, 1);     var = point[0];     var j = point[1];      if (!mapdata[i]) {         mapdata[i] = [];     }     if (!mapdata[i][j]) {         mapdata[i][j] = [];     }      mapdata[i][j]["one"] = test(i, j);     mapdata[i][j]["two"] = test(i, j);      colormatrix[mapdata[i][j]["two"]] = mapdata[i][j]["one"];  }  var len = ary1.length; var start = new date().gettime();  while (len--) {     calctest(ary1); }  var end = new date().gettime(); var time = end - start; alert('execution 338x338: ' + time);  var len2 = ary2.length; obj = {}; obj2 = {};  start = new date().gettime(); while (len2--) {     calctest(ary2); } end = new date().gettime(); time = end - start; alert('execution 339x339: ' + time); 

is memory issue javascript on chrome, or doing wrong objects? there way avoid higher processing duration?

i guess it's 1 or both of following.

• chrome resizing underlying hashtable somewhere between 338 * 338 , 339 * 339.
• garbage collection happening in same timeframe.

i doubt memory issue.