Benchmark: filter vs for..of vs for (i = 0..) vs preallocate

Script Preparation code:

function filterUsingFilter(numbers) {
  return numbers.filter((num) => num < 9);
}

function filterUsingForLoop(numbers) {
  const lessThan9 = [];
  for (let i = 0; i < numbers.length; i++) {
    if (numbers[i] < 9) {
      lessThan9.push(numbers[i]);
    }
  }
  return lessThan9;
}

function filterUsingForOfLoop(numbers) {
  const lessThan9 = [];
  for (const num of numbers) {
    if (num < 9) {
      lessThan9.push(num);
    }
  }
  return lessThan9;
}

function filterUsingForOfLoopPreallocate(numbers) {
  const lessThan9 = new Array(numbers.length);
  let index = 0;
  for (const num of numbers) {
    if (num < 9) {
      lessThan9[index++] = num;
    }
  }
  return lessThan9;
}

function filterUsingForIndexLoopPreallocate(numbers) {
  const lessThan9 = new Array(numbers.length);
  for (let i = 0; i < numbers.length; i++) {
    if (numbers[i] < 9) {
      lessThan9[i] = numbers[i];
    }
  }
  return lessThan9;
}

function filterUsingForOfLoopPreallocateWithEstimatedSize(numbers) {
  const lessThan9 = new Array(Math.floor(numbers.length / 2));
  let index = 0;
  for (const num of numbers) {
    if (num < 9) {
      lessThan9[index++] = num;
      if (index === lessThan9.length) {
        lessThan9.push(0);
      }
    }
  }
  return lessThan9;
}

function generateRandomArray(size) {
  const randomArray = new Array(size);
  for (let i = 0; i < size; i++) {
    randomArray[i] = Math.floor(Math.random() * 20); // Random integers between 0 and 19
  }
  return randomArray;
}

const randomArrays = [1,2,3,4].map((i) => generateRandomArray(100 ** i));

function bench(f) {
  for (let arr of randomArrays) {
    f(arr);
  }
}

Tests:

filterUsingFilter
bench(filterUsingFilter)
filterUsingForLoop
bench(filterUsingForLoop)
filterUsingForOfLoop
bench(filterUsingForOfLoop)
filterUsingForOfLoopPreallocate
bench(filterUsingForOfLoopPreallocate)
filterUsingForIndexLoopPreallocate
bench(filterUsingForIndexLoopPreallocate)
filterUsingForOfLoopPreallocateWithEstimatedSize
bench(filterUsingForOfLoopPreallocateWithEstimatedSize)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
filterUsingFilter
filterUsingForLoop
filterUsingForOfLoop
filterUsingForOfLoopPreallocate
filterUsingForIndexLoopPreallocate
filterUsingForOfLoopPreallocateWithEstimatedSize

Fastest: N/A

Slowest: N/A

ⓘ Get performance results from real users on your website with Request Metrics.

Website Performance Monitoring by Request Metrics

Latest run results:

Run details: (Test run date: 9 months ago)

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

Browser/OS: Chrome 115 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
filterUsingFilter	0.5 Ops/sec
filterUsingForLoop	1.0 Ops/sec
filterUsingForOfLoop	0.4 Ops/sec
filterUsingForOfLoopPreallocate	0.3 Ops/sec
filterUsingForIndexLoopPreallocate	0.2 Ops/sec
filterUsingForOfLoopPreallocateWithEstimatedSize	0.4 Ops/sec

filter vs for..of vs for (i = 0..) vs preallocate (version: 2)

Comparing performance of: filterUsingFilter vs filterUsingForLoop vs filterUsingForOfLoop vs filterUsingForOfLoopPreallocate vs filterUsingForIndexLoopPreallocate vs filterUsingForOfLoopPreallocateWithEstimatedSize

Created: 9 months ago by: Registered User

Jump to the latest result

filterUsingFilter

filterUsingForLoop

filterUsingForOfLoop

filterUsingForOfLoopPreallocate

filterUsingForIndexLoopPreallocate

filterUsingForOfLoopPreallocateWithEstimatedSize

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A