concat vs merge vs push

JavaScript performance comparison

Test case created by leeroy

Info

Take an object array add a new member to each entry.

Comparison - concat -> map - merge -> map - each -> push -> extend

Preparation code

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
   var baseArray = [
      {name: "foo"},
      {name: "bar"},
      {name: "baz"}
   ];

   //modified arrays
   var catArray = merArray = pushArray = [];

   //cache concat prototype for best performance
   var concat = Array.prototype.concat;

</script>

Preparation code output

Test runner

Warning! For accurate results, please disable Firebug before running the tests. (Why?)

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
Concat
catArray = concat.call(catArray, $.map(baseArray, function(value)
   {
      value["bla"] = "Banana";
      return value;
   })
);
pending…
Merge
$.merge(merArray, $.map(baseArray, function(value)
   {
      value["bla"] = "Banana";
      return value;
   })
);
pending…
Push
$.each(baseArray, function(key, value)
   {
     pushArray.push($.extend({}, value, { bla: "Banana" }))
   }
)
pending…

Compare results of other browsers

Revisions

You can edit these tests or add even more tests to this page by appending /edit to the URL. Here’s a list of current revisions for this page:

0 comments

Add a comment