Is Lodash That Good? Performance Comparison of JavaScript and Lodash by@yuraabharian

Is Lodash That Good? Performance Comparison of JavaScript and Lodash

Lodash it is modern JavaScript utility library delivering modularity, performance & extras.Β  This is what you will see when you open the official Lodash documentation. I think many of you have already either heard or worked with it, so let's get straight to the point.
image
Yura Abharian HackerNoon profile picture

Yura Abharian

I am a Senior Software Engineer. If you have any questions, you can contact me via [email protected] or LinkedIn

instagram social iconlinkedin social icongithub social icontwitter social icon


Lodash is a very popular JavaScript library and I have come across it in almost every project I have, but was it justified? is it that good? let's find out in this article.


What is Lodash?

It’s a modern JavaScript utility library delivering modularity, performance & extras.

This is what you will see when you open the official Lodash documentation.

I think many of you have already either heard or worked with it, so let's get straight to the point.


Note in this article I am using:

  • Lodash - v4.17.21
  • Node - v16.13.2


I created a test data array of 100 objects. If I paste this array here, it will take up half a page, so I will hide all elements in the array, but be aware that I am using 100 elements in my tests. By the way, you can find all test data on my GitHub by following this link.


Test 1: I want to simulate how a filter method works in JavaScript and Lodash.

Lodash filter performance test

import lodash from 'lodash';

const data = [...]; // 100 objects

console.time('lodash-filter');

lodash.filter(data, ({ isMarried }) => isMarried);

console.timeEnd('lodash-filter');


Lodash filter operation execution time: 0.146ms

[Running] node "/personal/lodash_vs_js/lodash-filter.js"
lodash-filter: 0.146ms

[Done] exited with code=0 in 0.091 seconds


JavaScript native filter method performance test

const data = [...]; // 100 objects

console.time('js-filter');

data.filter(({ isMarried }) => isMarried);

console.timeEnd('js-filter');


JavaScript filter operation execution time: 0.098ms

[Running] node "/personal/lodash_vs_js/js-filter.js"
js-filter: 0.098ms

[Done] exited with code=0 in 0.059 seconds


So as you can see javaScript native filter method is almost on 50% faster than Lodash filter method.


Test 2: In this test, I want to compare the performance of the map method in JavaScript and Lodash.


Lodash map method performance test

import lodash from 'lodash'; 

const data = [...]; // 100 objects

console.time('lodash-map');

lodash.map(data, (item) => {
    if (item.isMarried) {
        item.isHappy = true;
    }

    return item;
});

console.timeEnd('lodash-map');


Lodash map operation execution time: 0.269ms

[Running] node "/personal/lodash_vs_js/lodash-map.js"
lodash-map: 0.269ms

[Done] exited with code=0 in 0.09 seconds


JavaScript native map method performance test

const data = [...]; // 100 objects

console.time('js-map');

data.map((item) => {
    if (item.isMarried) {
        item.isHappy = true;
    }

    return item;
});

console.timeEnd('js-map');


JavaScript map operation execution time: 0.105ms

[Running] node "/personal/lodash_vs_js/js-map.js"
js-map: 0.105ms

[Done] exited with code=0 in 0.058 seconds


So in the second test JavaScript native map is more than on 100% faster than Lodash map method.


Test 3: In this test, I want to compare the performance of a flat method in JavaScript and

Lodash.


Lodash flatten method performance test

import lodash from 'lodash'; 

const nonFlattnedArray = [...]; // 30 elements

console.time('lodash-flat');

lodash.flatten(nonFlattnedArray);

console.timeEnd('lodash-flat');


Lodash flatten operation execution time: 0.153ms

[Running] node "/personal/lodash_vs_js/lodash-flat.js"
lodash-flat: 0.153ms

[Done] exited with code=0 in 0.09 seconds


JavaScript native flat method performance test

const nonFlattnedArray = [...]; // 30 elements

console.time('js-flat');

nonFlattnedArray.flat();

console.timeEnd('js-flat');


JavaScript flat operation execution time: 0.088ms

[Running] node "/personal/lodash_vs_js/js-flat.js"
js-flat: 0.088ms

[Done] exited with code=0 in 0.058 seconds


So in the third test, the native JavaScript flat method is almost 90% faster than Lodash flatten method.


Test 4: In this test, I want to compare the performance of the sort method in JavaScript and Lodash.


Lodash sort method performance test

import lodash from 'lodash'; 

const randomArray = [...]; // 100 elements

console.time('lodash-sort');

lodash.sortBy(randomArray);

console.timeEnd('lodash-sort');


Lodash sort operation execution time: 0.905ms

[Running] node "/personal/lodash_vs_js/lodash-sort.js"
lodash-sort: 0.905ms

[Done] exited with code=0 in 0.092 seconds


JavaScript native sort method performance test

const randomArray = [...]; // 100 elements

console.time('js-sort');

randomArray.sort();

console.timeEnd('js-sort');


JavaScript sort operation execution time: 0.118ms

[Running] node "/personal/lodash_vs_js/js-sort.js"
js-sort: 0.118ms

[Done] exited with code=0 in 0.059 seconds


So in the fourth test, the native JavaScript sort method is almost 700% faster than Lodash's sort method.


Test 5: In this test, I want to compare the performance of the find method in JavaScript and Lodash.


Lodash find method performance test

import lodash from 'lodash'; 

const data = [...]; // 100 elements

console.time('lodash-find');

lodash.find(data, ({ name }) => name === 'Camryn');

console.timeEnd('lodash-find');


Lodash find operation execution time: 0.294ms

[Running] node "/personal/lodash_vs_js/lodash-find.js"
lodash-find: 0.294ms

[Done] exited with code=0 in 0.091 seconds


JavaScript native find method performance test

const data = [...]; // 100 elements

console.time('js-find');

data.find(({name}) => name === 'Camryn');

console.timeEnd('js-find');


JavaScript find operation execution time: 0.133ms

[Running] node "/personal/lodash_vs_js/js-find.js"
js-find: 0.133ms

[Done] exited with code=0 in 0.059 seconds


So in the fifth test, the native JavaScript find method is almost 200% faster than Lodash find method.


Test 6: In this test, I want to compare the performance of the forEach method in JavaScript and Lodash.


Lodash forEach method performance test

import lodash from 'lodash'; 

const data = [...]; // 100 elements

console.time('lodash-forEach');

lodash.forEach(data, (item) => {
    item.checked = true;
});

console.timeEnd('lodash-forEach');


Lodash forEach operation execution time: 0.148ms

[Running] node "/personal/lodash_vs_js/lodash-forEach.js"
lodash-forEach: 0.148ms

[Done] exited with code=0 in 0.091 seconds


JavaScript native forEach method performance test

const data = [...]; // 100 elements

console.time('js-forEach');

data.forEach((item) => {
    item.checked = true;
});

console.timeEnd('js-forEach');


JavaScript forEach operation execution time: 0.099ms

[Running] node "/personal/lodash_vs_js/js-forEach.js"
js-forEach: 0.099ms

[Done] exited with code=0 in 0.059 seconds


So, in the sixth test, native JavaScript forEach is almost 50% faster than Lodash's forEach method.


Conclusion: Lodash is a very powerful tool in the hands of a developer, but you have to be very careful with it and use it wisely. I'm sure there are certain cases where we need Lodash, but in general we should avoid using third party libraries prefering native methods if posible. You can find all examples on my GitHub


P.S I really like Lodash, the purpose of this article is for developers to use it for its intended purpose



react to story with heart
react to story with light
react to story with boat
react to story with money
L O A D I N G
. . . comments & more!