Remove all uses of top-level lodash import #1882
Open
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
robknight
force-pushed
the
robknight/0xp-1200-replace-lodash-imports-with-specific-function-imports
branch
from
0605758
to
5b14489
Compare
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Closes https://linear.app/0xparc-pcd/issue/0XP-1200/replace-lodash-imports-with-specific-function-imports
Importing lodash like this:
import _ from "lodash";imports the entire lodash library, which is often not what you want if you just want to call, say,_.isEqual(). Instead, you can doimport isEqual from "lodash/isEqual", which will import only theisEqualfunction and nothing else. Eliminating the unused code reduces the bundle size. Modern ESM libraries can be "tree-shaken" to eliminate dead code automatically, but lodash is not one of these.In this PR, we avoid importing around 500KiB of uncompressed JavaScript by replacing all of the instances of
import _ from "lodash"with imports of the specific functions to be used. The impact on final bundle size is somewhat smaller - maybe a 60KiB reduction in the size of thepassport-clientbundle - because lodash compresses very well. However, this will be a meaningful reduction in runtime parsing of the resulting JavaScript.In addition to changing the existing imports, I've added an ESLint rule to ensure that no new top-level imports are added.
This was prompted by noticing that, for the reference PARCNET client build, the single largest dependency was
lodash, as a result of it being imported by@pcd/gpc: