Lodash, how much do we pay for it? (Performance improvement)

All of us like to use this nice library that makes our life easier, but before your next import let’s understand how much it costs and how we can reduce it.

Where did it all begin?
In one of my projects in React Native, I tried to figure out why the app was too big and one of the things that made the app great was Lodash,
Like everyone else I used Lodash in several places in the project and in every file I needed a function from the library i added the line

import _ from lodash

This operation costs us more or less 70kb, it depends on the version,
If we just want to use the great groupBy function in this file, we’ll pay for the all Lodash library and not just groupBy.
Maybe we’ll use brackets in import and save the costs?

import { groupBy, isEmpty} from "lodash"

So we found that there is no advantage to this method, and we’ll pay for the all Lodash library again.

Solution

Import each function separately:

import groupBy from "lodash/groupBy"
import isEmpty from "lodash/isEmpty"

In this case, only the specific functions are imported and we saved a lot of space.
Usually, we do not use too many functions from Lodash in the same file, so some “import” rows will not do so much damage.
But usage will change

const checkList = groupBy(contentList, 'check')

Some people recommended the Lodash-es package but after a little testing, i realized it didn’t save anything.