found drama

An experiment (in part to settle something of academic debate); what is faster new Array() or [] ¹?  The function for the test case:

	function makeSomeArrays(){
	var outputter = function(fn){
	var ts = new Date().getTime();
	fn();
	var te = new Date().getTime();
	console.log("total time: " + (te-ts)/1000 +
	" seconds");
	};
	// 1 million:
	var L = 1000000;
	// use Array constructor; push L new arrays...
	var test1 = function(){
	var a = new Array();
	for (var i=0; i<l ; i++) {
	a.push(new Array());
	}
	};
	// same as above - but in each case,
	// declare a length to the array
	var test2 = function(){
	var a = new Array(L);
	for (var i=0; i<L; i++) {
	a.push(new Array(0));
	}
	};
	// same as above but via index assignment
	var test3 = function(){
	var a = new Array(L);
	for (var i=0; i<L; i++) {
	a[i] = new Array(0);
	}
	};
	// for 4-6: replace Array constructor w/ Array literal
	// notation except where declaring a length
	// (container array, 5 + 6)
	var test4 = function(){
	var a = [];
	for (var i=0; i<L; i++) {
	a.push([]);
	}
	};
	var test5 = function(){
	var a = new Array(L);
	for (var i=0; i<L; i++) {
	a.push([]);
	}
	};
	var test6 = function(){
	var a = new Array(L);
	for (var i=0; i<L; i++) {
	a[i] = [];
	}
	};
	var tests = [test1, test2, test3, test4, test5, test6];
	for (var j=0; j<tests.length; j++) {
	console.info("test #" + (j+1) + ":");
	outputter(tests[j]);
	}
	}

view raw make-some-arrays.js hosted with by GitHub

Yes, I realize that test #2 and test #5 result in an array with a length of 2,000,000 (vs. 1,000,000 for the other 4 tests).

Now for some chart porn; results:

As usual in these kinds of performance tests, shorter bars mean better/faster performance.  (And yes, test case #5 was wildly out-of-scale when run in Firefox ².)

Test case #3 wins out in Firefox (1.536 seconds), but test case #6 wins in both Chrome and Safari (0.313 and 0.397 seconds, respectively).  Interestingly, Safari out-performed Chrome in 4 of the 6 test cases; but Chrome came out on top overall with that 0.313 second figure for test case #6.  The trick seems to be in assigning a length to the array and then assigning values to the indices instead of just pushing the values onto the end.

But this seems to wind up not answering the original question about Array() vs. [].  So really quickly (in Chrome), I re-ran test #6 with a new “test #7” that replaced a[i] = [] with a[i] = new Array().  Console output:

	jsc make-some-arrays.js
	test #6:
	total time: 0.405 seconds
	test #7:
	total time: 0.892 seconds

view raw gistfile1.eclass hosted with by GitHub

Oh wait… that was basically the same as test #3…  Hooray for Array literals!

1. Knowing full well that it’s never as simple as that.[]
2. Due in large part to the fact that it paused execution to request my intercession.  But that doesn’t exactly bode well anyway, does it?[]

About Rob Friesel

2 Responses to getting academic on the JavaScript Array