<script src="https://cdn.jsdelivr.net/lodash/4.17.21/lodash.min.js"></script>
const arraySize = 10;
window.array = _.range(arraySize).map(() => Math.random());
function manualMethod1(array) {
let x = 0;
let len = array.length;
for (let i = 0; i < len; i++) {
if (array[i] > .5) {
x++;
}
}
return x;
}
function manualMethod2(array, test) {
let x = 0;
let len = array.length;
for (let i = 0; i < len; i++) {
if (test(array[i])) {
x++;
}
}
return x;
}
function manualMethod3(array, test) {
let x = 0;
for (let i of array) {
if (test(i)) {
x++;
}
}
return x;
}
const x = _.filter(window.array, i => i > .5).length;
return x;
const x = _.sumBy(window.array, i => i > .5 ? 1 : 0);
return x;
const x = _(window.array).filter(i => i > .5).size();
return x;
return manualMethod1(window.array);
return manualMethod2(window.array, i => i > .5);
return manualMethod3(window.array, i => i > .5);
--enable-precise-memory-info
flag.
Test case name | Result |
---|---|
Filter length | |
lodash sumBy | |
lodash filter chaining | |
manualMethod1 | |
manualMethod2 (with lambda function test) | |
manualMethod3 (for-each loop, with lambda function test) |
Test name | Executions per second |
---|---|
Filter length | 3658686.2 Ops/sec |
lodash sumBy | 4611254.0 Ops/sec |
lodash filter chaining | 1018792.1 Ops/sec |
manualMethod1 | 6866455.5 Ops/sec |
manualMethod2 (with lambda function test) | 6364288.0 Ops/sec |
manualMethod3 (for-each loop, with lambda function test) | 4468476.5 Ops/sec |
Let's break down the benchmark and explain what's being tested.
Benchmark Definition
The benchmark tests four different approaches to count the number of elements in an array that meet a certain condition:
manualMethod1
: A custom implementation using a traditional for
loop.manualMethod2
: A custom implementation using a for
loop with a lambda function test.manualMethod3
: A custom implementation using a for...of
loop with a lambda function test (ES6+ feature)._filter
and _sumBy
from the Lodash library: Two popular utility functions for array manipulation.Options being compared
The benchmark compares the performance of each approach:
for
, for...of
, and a combination of both)._filter
and _sumBy
functions, which are designed to be efficient and optimized.Pros and cons
Here's a brief summary of each approach:
manualMethod1
): Pros: Simple, easy to understand. Cons: May be slower due to the overhead of explicit looping.manualMethod2
): Pros: Similar to manualMethod1
, but with the added benefit of a lambda function test. Cons: Still may be slower than optimized libraries like Lodash.manualMethod3
): Pros: Modern, concise syntax using for...of
. Cons: May have performance overhead due to the newer language feature._filter
, with the added benefit of calculating the sum directly.Library usage
The benchmark uses the Lodash library for its _filter
and _sumBy
functions. These functions are designed to be efficient, reliable, and easy to use, making them popular choices among developers.
Special JavaScript feature or syntax
Note that manualMethod3
uses the for...of
loop with a lambda function test (ES6+ feature). This is a modern looping construct that allows for concise and expressive code. However, its performance characteristics may vary compared to traditional for
loops.
Other alternatives
If you're interested in exploring alternative approaches, consider:
Array.prototype.filter()
or String.prototype.indexOf()
.When evaluating this benchmark, keep in mind that the results may depend on various factors, including:
I hope this explanation helps you understand the benchmark and make informed decisions about your own code optimization efforts!