Run results for: JS native vs js native loop vs Ramda vs. Lodash 4

Compares performance on the same task using Lodash vs two styles of Ramda vs two styles of "native" Javascript. In all cases the task is pulling "counter" property from each item in an array, filtering out odd items, squaring them, then returning those squared values that have less than two digits.

Go to the benchmark

Run details:

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:101.0) Gecko/20100101 Firefox/101.0

Browser: Firefox 101

Operating system: Mac OS X 10.15

Device Platform: Desktop

Date tested: 2 years ago

Test name	Executions per second
JS native	169.6 Ops/sec
Ramda with transducer	45.9 Ops/sec
Ramda with transducer (no prop)	168.7 Ops/sec
Ramda with currying and composition	51.2 Ops/sec
Ramda without relying on currying or composition	50.8 Ops/sec
Ramda with currying and composition (no pluck)	182.6 Ops/sec
Lodash	151.6 Ops/sec
js native loop	246.2 Ops/sec

HTML Preparation code:

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

Script Preparation code:

var data = _.range(100000).map(function(i) {
  return {
    counter: i
  }
});

function isOdd(num) {
  return num % 2 === 1;
}

function square(num) {
  return num * num;
}

function lessThanThreeDigits(num) {
  return num.toString().length < 3;
}

Tests:

JS native
var result = data .map(({counter}) => counter) .filter(isOdd) .map(square) .filter(lessThanThreeDigits)
Ramda with transducer
var transducer = R.compose ( R.map(R.prop('counter')), R.filter(isOdd), R.map(square), R.filter(lessThanThreeDigits), ); var result = R.transduce ( transducer, (acc, val) => { acc.push(val); return acc; }, [], data, );
Ramda with transducer (no prop)
var transducer = R.compose ( R.map(({counter}) => counter), R.filter(isOdd), R.map(square), R.filter(lessThanThreeDigits), ); var result = R.transduce ( transducer, (acc, val) => { acc.push(val); return acc; }, [], data, );
Ramda with currying and composition
var result = R.pipe( R.pluck('counter'), R.filter(isOdd), R.map(square), R.filter(lessThanThreeDigits) )(data);
Ramda without relying on currying or composition
var result = R.filter(lessThanThreeDigits, R.map(square, R.filter(isOdd, R.pluck('counter', data))));
Ramda with currying and composition (no pluck)
var result = R.pipe( R.map (({counter}) => counter), R.filter(isOdd), R.map(square), R.filter(lessThanThreeDigits) )(data);
Lodash
var result = _.chain(data) .map('counter') .filter(isOdd) .map(square) .filter(lessThanThreeDigits) .value();
js native loop
let result = []; for (let i=0; i<data.length; i++) { const { counter } = data[i]; if (isOdd (counter)) { let squared = square (counter); if (lessThanThreeDigits (squared)) { result.push (squared); } } }

Run results for: JS native vs js native loop vs Ramda vs. Lodash 4

Compares performance on the same task using Lodash vs two styles of Ramda vs two styles of "native" Javascript. In all cases the task is pulling "counter" property from each item in an array, filtering out odd items, squaring them, then returning those squared values that have less than two digits.

JS native

Ramda with transducer

Ramda with transducer (no prop)

Ramda with currying and composition

Ramda without relying on currying or composition

Ramda with currying and composition (no pluck)

Lodash

js native loop