My Problem With Lodash.js. A case against overusing some functions | by Michał Burgunder

Case against overuse of certain functions

Lodash is hailed as an essential library for JavaScript for good reason. It is a library that provides a lot of functions, some more intuitive than others, which makes a developer’s job a lot easier. However, over-reliance on lodash may come with the cost of efficiency as well as readability of the code.

Before I get into the details, I must admit, I am not a senior programmer, or an engineer with a formal software background. I have a year’s experience in the world of software engineering and coding, and I’m probably talking my depth here. maybe tailor Is A library that must be learned and used frequently. However, for me, this comes with significant readability costs.

Having written a screenplay, several short stories and a short play, I have always had a habit of writing, which is why I pay a lot of attention to code quality and readability. To me, writing code is akin to writing short stories, in that to get to a point quickly, it needs to be written in a readable, and dense syntax/style. In the case of coding, this concept almost translates into efficiency.

Having said that, using losh for every problem, which I feel, is unnecessary. The spread operator, for example, makes many of the functionality of lodash redundant, as well as more readable.

I found that the best example where the spread operator can be used is for lodash _.assign() Celebration. In short, the function assigns all values ​​of one object to another:

let prop1 =  b: "Some property", d: null ;
let prop2 = a: [2, 3], c: "An amazing String", d: 777 ;
let prop3 = a: 888 ;
let prop4 = a: 999 ;
const finalProp = _.assign(prop1, prop2, prop3, prop4); console.log(finalProp);
// ==> a: 999, b: 'Some property', d: 777, c: 'An amazing String'

This is undoubtedly an extremely useful function. However, it is very easily reproducible, and we, in most cases, do not need to import lodash,

const finalProp =  ...prop1, ...prop2, ...prop3, ...prop4 ;
console.log(finalProp);
// ==> a: 999, b: 'Some property', d: 777, c: 'An amazing String'

The first method may sound nice, especially if one is already familiar with the assign() function. For style, though, there are good reasons to go with the second method:

  1. There are no additional functions, which makes the file more readable. Only plain JavaScript is used.
  2. Removes the ambiguity of what is happening in it assign Function, which can do something that the programmer does not expect.
  3. You are not importing anything in the file.

It’s also much more efficient: running the two functions in two separate files takes (n=10) on average 3.290ms for custom function, while lodash method takes on average 4.218ms, Thus, the custom function is 28% more efficient than the lose function.

This is the work I dislike the most. The function is aptly named, coming from set theory, although it also requires us to be more aware of a hidden complexity: applying the union function on two arrays, not just adding both arrays but it also removes the duplicates of the last array:

const _ = require("lodash");
const array1 = [1, 4, "hello", 2, 999];
const array2 = [2, "there", 4.7, "hello"];
console.time();
const finalArray = _.union(array1, array2);
console.timeEnd();
// console.log(finalArray);
// ==> [ 1, 4, 'hello', 2, 999, 'there', 4.7 ]

Using similar objects, we can simply use const finalArray = new Set([...array1, ...array2]); To obtain the same result, again with increased efficiency (0.578ms for losh, 0.107ms For in-house, 540% more efficient). Plus, it’s even more obvious what’s actually happening when written explicitly.

This one is interesting because it’s a function I still use. When we first encountered JavaScript/programming, many of us were probably a little puzzled by how one couldn’t easily create new objects:

let pocket = ["phone", "wallet"];
let anotherPocket = pocket;
pocket.push("keys");
console.log(pocket === anotherPocket);
// ==> true

If we were unlucky with the solution we found, or if we had sharpened our learning (like me), we might have learned the Lochs solution, which duplicates any object given a function:

const _ = require("lodash");
let suitcase = clothes: true ;
let vacationItems = tripleTap: true, bag: suitcase ;
const vacationItemsClone = _.clone(vacationItems);

Although this solution works to make a shallow copy of a given object, it took me about an average of 0.611ms To clone this item. A better solution, to my mind, is one that uses the spread operator again:

let suitcase =  clothes: true ;
let vacationItems = tripleTap: true, bag: suitcase ;
const vacationItemsClone = ...vacationItems ;

The spread operator helps us to get the same result when taking only 0.105ms, It is 5.8 times (581% more efficient) faster than the LOSCH function! Another, similar method of cloning, gives almost the same time-frame. Of course, the objects given are very simple and there are possible instances in which my solution doesn’t work. Otherwise, the losh function will not be needed anymore.

but what about deepCloning An object, so that internal object references can also be cloned? For this, lodash Works a lot neat, but again inefficient:

const _ = require("lodash");let suitcase =  clothes: true ;
let vacationItems = tripleTap: true, bag: suitcase ; console.time();
const vacationItemsDeepClone = _.cloneDeep(vacationItems);

On my Mac, this function takes on average 0.985msWhereas my custom function only takes 0.197ms(500% more efficient):

let suitcase =  clothes: true ;
let vacationItems = tripleTap: true, bag: suitcase ;
console.time();
const vacationItemsDeepClone = JSON.parse(
JSON.stringify(vacationItems)
);
console.timeEnd();

Clearly, this is a far more complicated-looking function than a simple one. cloneDeep()from losh, that’s why I still use cloneDeep() from losh. I agree that lodash The function isn’t particularly efficient, but it makes one’s code more readable and you won’t have to worry about the JSON class trying to string And Parse a very large object.

Lodash is a great library with many resources. I’ve often used the lodash.js function, such as difference()either isEqual(), However, I am claiming that excessive use of lodash.js, especially for some of the tasks I mentioned, can have a negative impact on your project.

Having code containing many different lodash.js functions requires new developers to learn packages rather than JavaScript, which takes time and effort. Using library functions, where simple functions will do, will reduce one’s understanding of a programming language, which, over time, will reduce one’s effectiveness at coding.

Leave a Reply