Is it bad practise to import all functions from node modules?

user_14506973 0
Viewed 332

I'm not sure if this has been asked before but I couldn't find the answer, but I want to ask, does it make a difference between importing all functions from a node_module in react(I am assuming the same logic will apply to other frameworks like angular and yes I know react is not a framework it is a library) vs importing only the function you are going to use (in both cases we only use the function we wanted to use)?

For example, we can import all and do this

import * as FaIcons from "react-icons/fa";

<FaIcons.FaEnvelopeOpen />

Or only import the function we need like this

import { FaEnvelopeOpen } from 'react-icons/fa';

<FaEnvelopeOpen />

I am leaning towards the first method as it makes future edits easier but is this bad practise or slow down performance? Sorry if this is an obvious answer, I'm new to programming and not sure.

node-modules reactjs
1 Answers

Yes. This is generally considered bad practice as far as imports are concerned. Minimizing the imported modules can severely improve performance. While the size of the module you're dealing with maybe small enough to cause only a marginal performance difference, dealing with larger, shaken codebases like @material-ui/core can scale this up drastically. If you're interested in maximizing the performance of your imports, I would also recommend looking into dynamically importing your necessary codebase.

But, as mentioned above, if the package supports shaking then the imports here would be impacted; otherwise, no difference would be apparent.

user_121099580
Related