Benchmark: Promo Map - MeasureThat.net

HTML Preparation code:

<html>
    <head>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
        <script>
        underscore = _;
        </script>


        <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.12.0/lodash.min.js"></script>

        <script>
        lodash = _;
        </script>
    </head>
    <body>
    </body>
</html>

​x
 
<html>
    <head>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
        <script>
        underscore = _;
        </script>
​
​
        <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.12.0/lodash.min.js"></script>
​
        <script>
        lodash = _;
        </script>
    </head>
    <body>
    </body>
</html>
​

Script Preparation code:

var PromosArray = [
    {
        type: "regular",
        display: "$123.00"
    },
    {
        type: "markdown",
        display: "$100.00"
    },
    {
        type: "promo",
        display: "$80.00"
    }
];

function testArrayIteration() {
    var items = [];
    var i;

    for (i = 0; i < PromosArray.length; i++) {
        items.push(PromosArray[i].type);
    }

    return items;
  
}

function testArrayMap() {
    return PromosArray.map(function (promo) {
        return promo.type;
    });
}

function testUnderscoreMap() {
    return underscore.map(PromosArray, function (promo) {
        return promo.type;
    });
}

function testLodashMap() {
    return lodash.map(PromosArray, function (promo) {
        return promo.type;
    });
}

function testForLoop() {
    var newArray = [];
  
  	for (var i = 0; i < PromosArray.length; i++) {
     	newArray[i] = PromosArray[i].type; 
    }
  
  	return newArray;
}

 
​var PromosArray = [    {        type: "regular",        display: "$123.00"    },    {        type: "markdown",        display: "$100.00"    },    {        type: "promo",        display: "$80.00"    }];​function testArrayIteration() {    var items = [];    var i;​    for (i = 0; i < PromosArray.length; i++) {        items.push(PromosArray[i].type);    }​    return items;  }​function testArrayMap() {    return PromosArray.map(function (promo) {        return promo.type;    });}​function testUnderscoreMap() {    return underscore.map(PromosArray, function (promo) {        return promo.type;    });}​function testLodashMap() {    return lodash.map(PromosArray, function (promo) {        return promo.type;    });}​function testForLoop() {    var newArray = [];      for (var i = 0; i < PromosArray.length; i++) {        newArray[i] = PromosArray[i].type;     }      return newArray;}​

Tests:

testArrayIteration
testArrayIteration();
testArrayIteration();
testArrayMap
testArrayMap();
testArrayMap();
testUnderscoreMap
testUnderscoreMap();
testUnderscoreMap();
testLodashMap
testLodashMap();
testLodashMap();
testForLoop
testForLoop();
testForLoop();

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Experimental features:

Memory measurements supported only in Chrome.
For precise memory measurements Chrome must be launched with --enable-precise-memory-info flag.
More information: Monitoring JavaScript Memory

Test case name	Result
testArrayIteration
testArrayMap
testUnderscoreMap
testLodashMap
testForLoop

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 8 years ago)

User agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36

Browser/OS: Chrome 52 on Windows 7

View result in a separate tab

Test name	Executions per second
testArrayIteration	1233339.6 Ops/sec
testArrayMap	1648972.4 Ops/sec
testUnderscoreMap	1935855.0 Ops/sec
testLodashMap	1995094.4 Ops/sec
testForLoop	1265144.1 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated 5 months ago):

Let's break down the benchmark and explain what's being tested.

Benchmark Overview

The benchmark is designed to measure the performance of four different ways to extract the type property from an array of objects: using Array.prototype.map(), underscore.js, lodash.js, and a traditional for loop.

Options Compared

Array.prototype.map(): This method creates a new array with the results of applying the provided function on every element in this array.
Underscore.js (_): A JavaScript library that provides functional programming helpers, including map().
Lodash.js (_): Another popular JavaScript library that provides functional programming helpers, including map().
Traditional for loop: This method uses a manual for loop to iterate over the array and extract the desired property.

Pros and Cons of Each Approach

Array.prototype.map():
- Pros: Efficient, concise, and easy to read.
- Cons: Creates a new array with the results, which can be memory-intensive for large datasets.
Underscore.js (_`): Pros: Provides a simple and concise way to perform common functional programming tasks. Cons: Adds an external dependency (the underscore library) and may not be familiar to all developers.
Lodash.js (_`): Similar to Underscore.js, but with more features and options. Pros: Provides more functionality than Underscore.js, but also adds an extra dependency.
Traditional for loop:
- Pros: No external dependencies, easy to understand and implement.
- Cons: Can be slower and less efficient than the other methods.

Library Descriptions

Underscore.js: A lightweight JavaScript library that provides functional programming helpers, such as map(), filter(), and more.
Lodash.js: A more comprehensive JavaScript library built on top of Underscore.js, providing a wider range of functional programming tools.

Other Considerations

The benchmark measures the execution time of each approach, which is relevant for performance-critical applications or systems that need to handle large datasets quickly.
The use of external libraries (Underscore.js and Lodash.js) may impact the overall performance and size of the application.

Alternatives

If you don't want to use external libraries, you can also consider using other methods, such as:

Array.prototype.forEach() instead of map()
Using a custom function or method to extract the desired property
Using a different data structure, like an object or a Map, if the properties are not indexed by name.

However, these alternatives may have different performance characteristics and trade-offs compared to the approaches tested in this benchmark.

LLMs can make mistakes. Check important info.

Let's break down the benchmark and explain what's being tested.

**Benchmark Overview**

The benchmark is designed to measure the performance of four different ways to extract the `type` property from an array of objects: using `Array.prototype.map()`, `underscore.js`, `lodash.js`, and a traditional `for` loop.

**Options Compared**

1. **Array.prototype.map()**: This method creates a new array with the results of applying the provided function on every element in this array.
2. **Underscore.js (`_`)**: A JavaScript library that provides functional programming helpers, including `map()`.
3. **Lodash.js (`_`)**: Another popular JavaScript library that provides functional programming helpers, including `map()`.
4. **Traditional `for` loop**: This method uses a manual `for` loop to iterate over the array and extract the desired property.

**Pros and Cons of Each Approach**

1. **Array.prototype.map()**:
	* Pros: Efficient, concise, and easy to read.
	* Cons: Creates a new array with the results, which can be memory-intensive for large datasets.
2. **Underscore.js` (`_`)**: Pros: Provides a simple and concise way to perform common functional programming tasks. Cons: Adds an external dependency (the underscore library) and may not be familiar to all developers.
3. **Lodash.js` (`_`)**: Similar to Underscore.js, but with more features and options. Pros: Provides more functionality than Underscore.js, but also adds an extra dependency.
4. **Traditional `for` loop**:
	* Pros: No external dependencies, easy to understand and implement.
	* Cons: Can be slower and less efficient than the other methods.

**Library Descriptions**

1. **Underscore.js**: A lightweight JavaScript library that provides functional programming helpers, such as `map()`, `filter()`, and more.
2. **Lodash.js**: A more comprehensive JavaScript library built on top of Underscore.js, providing a wider range of functional programming tools.

**Other Considerations**

* The benchmark measures the execution time of each approach, which is relevant for performance-critical applications or systems that need to handle large datasets quickly.
* The use of external libraries (Underscore.js and Lodash.js) may impact the overall performance and size of the application.

**Alternatives**

If you don't want to use external libraries, you can also consider using other methods, such as:

* `Array.prototype.forEach()` instead of `map()`
* Using a custom function or method to extract the desired property
* Using a different data structure, like an object or a Map, if the properties are not indexed by name.

However, these alternatives may have different performance characteristics and trade-offs compared to the approaches tested in this benchmark.

Related benchmarks:

Promo Map (version: 0)

Comparing performance of: testArrayIteration vs testArrayMap vs testUnderscoreMap vs testLodashMap vs testForLoop

Created: 8 years ago by: Guest

Jump to the latest result

testArrayIteration

testArrayMap

testUnderscoreMap

testLodashMap

testForLoop

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated 5 months ago):