Typescript import best practices?
Is there a difference in the compiled package between
import { useEffect } from "react"
vs
?
I remember someone showing how
import Box from "@mui/material/Box";
was significantly different than
import Box from "@mui/material";
and wasn't sure if this was similar.6 Replies
Unknown User•2y ago
Message Not Public
Sign In & Join Server To View
I just ran a quick test with create-react-app (react 18) and confirmed that the difference in compiled package between useEffect vs React.useEffect has zero impact on the resulting package.
Unknown User•2y ago
Message Not Public
Sign In & Join Server To View
Thanks. I haven't used one of those before, I'll dig into it.
Interestingly the difference between
import Box from '@mui/material/Box
and
import {Box} from '@mui/material
is also 0 with latest versions.Unknown User•2y ago
Message Not Public
Sign In & Join Server To View
Named imports are better than default imports because if it can be tree shaken it will be, default can never be.
It took me ages to figure out how to make a treeshakable lib, the only tool at the time that seemed to work was roll up, webpack could treeshake a build but at the time couldn't make something that was treeshakable.
There is a subtle difference between tree shaking and a bundler that omits unused code.