Benchmark: fight to the death - for loop vs chained array methods (100,000)

Script Preparation code:

const randomStDate = () => {
    const randD = new Date(new Date("2021-12-05").getTime() + Math.random() * (new Date("2026-12-05").getTime() - new Date("2023-12-05").getTime()))
    let month = '' + (randD.getMonth() + 1);
    let day = '' + randD.getDate();
    let year = randD.getFullYear();
    if (month.length < 2) month = '0' + month;
    if (day.length < 2) day = '0' + day;
    return [year, month, day].join('-');

};

const rndId = Math.floor(Math.random() * (100000000 - 1 + 1) + 1)

const createArr = () => {
    let workArr = []
    for (let i = 0; i < 100000; i++) {
        const pl = {
            tisId: rndId,
            startDate: randomStDate(),
            endDate: "2026-12-05",
            site: "Liverpool",
        }
        workArr.push(pl)

    }
    return workArr
}

var workArr = createArr()
var today = new Date().toISOString().slice(0, 10)

Tests:

for loop (added a sort on the end to even things up)
let pastArr = []; let futureArr = []; for (let i = 0; i < workArr.length; i++) { const pl = workArr[i]; switch(true){ case pl.startDate <= today : pastArr.push(pl); break; case futureArr.length < 1 && pl.startDate > today : futureArr = [pl]; break; case futureArr.length > 0 && pl.startDate < futureArr[0].startDate : futureArr = [pl]; break; case futureArr.length > 0 && pl.startDate === futureArr[0].startDate : futureArr.push(pl); break; } } return [...pastArr, ...futureArr].sort((a, b) => (a.startDate > b.startDate ? 1 : -1));
chained arr methods
const firstFutureWorks = workArr .filter(w => w.startDate > today) .sort((a, b) => (a.startDate > b.startDate ? 1 : -1)); const nextFutureDate = firstFutureWorks[0] ? firstFutureWorks[0].startDate : today; return workArr.filter(w => w.startDate <= nextFutureDate);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
for loop (added a sort on the end to even things up)
chained arr methods

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/130.0.0.0 Safari/537.36

Browser/OS: Chrome 130 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
for loop (added a sort on the end to even things up)	32.3 Ops/sec
chained arr methods	186.9 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

LLMs can make mistakes. Check important info.

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

**Benchmark Definition**

The benchmark measures the performance of two approaches to filter and sort an array of objects:

1. **For Loop**: This approach uses a traditional for loop to iterate over the array, filtering and sorting the elements in-place.
2. **Chained Array Methods**: This approach uses chained methods (e.g., `filter()`, `sort()`) to manipulate the array.

**Options Compared**

The benchmark is comparing the performance of these two approaches on an array of 100,000 objects, each with a random start date. The array is created using a script that generates random dates and creates an object for each one.

**Pros and Cons of Each Approach**

1. **For Loop**
	* Pros:
		+ Can be more efficient for large arrays since it avoids the overhead of function calls.
		+ Can be easier to understand for developers familiar with traditional loops.
	* Cons:
		+ Can be slower due to the need to manually increment a loop counter.
		+ May not be as flexible or expressive as chained methods.
2. **Chained Array Methods**
	* Pros:
		+ Can be faster since it avoids the overhead of manual looping and only requires function calls.
		+ Can be more concise and expressive, making code easier to read and maintain.
	* Cons:
		+ May have higher overhead due to the number of function calls.
		+ Can be less intuitive for developers unfamiliar with chained methods.

**Library and Special JS Features**

The benchmark uses no external libraries. However, it does utilize JavaScript's `Date` object and its various methods (e.g., `getTime()`, `getMonth()`).

**Other Considerations**

When writing performance benchmarks like this one, consider the following:

* Use a representative input dataset that is representative of real-world use cases.
* Choose a suitable benchmarking methodology (e.g., microbenchmarking).
* Run multiple iterations to ensure reliable results and account for variations in execution time.
* Test on different hardware configurations and browsers to account for differences in performance.

**Alternatives**

Other approaches to filtering and sorting arrays include:

1. **Reduce()**: A method that applies a function to each element of an array, reducing it to a single value.
2. **Array.prototype.every()**: A method that returns `true` if all elements of an array pass the test implemented by a provided function.
3. **Array.prototype.findIndex()**: A method that returns the index of the first element in an array that satisfies a provided condition.

These alternatives may offer different performance characteristics or trade-offs between readability, conciseness, and flexibility.

Related benchmarks:

fight to the death - for loop vs chained array methods (100,000) (version: 3)

array length 100,000

Comparing performance of: for loop (added a sort on the end to even things up) vs chained arr methods

Created: 3 years ago by: Registered User

Jump to the latest result

for loop (added a sort on the end to even things up)

chained arr methods

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):