导入一个函数是否需要加载整个库？

Question

我在StackOverflow上看到有人说：“那些特性可以很容易地不使用 lodash 实现。”

当然，安装库需要花费时间，但是当您

import { throttle } from 'lodash'

这个导入会减慢页面加载速度吗？因为 lodash 是一个很大的库？还是因为我只导入了 throttle 所以没关系？不要只考虑 lodash，把它看作是一个庞大的库，而我只想使用其中的一个函数。

附注：我正在使用React（使用CRA创建），所以默认的打包工具是webpack。

- shapeless

---

@ggorlen 我正在使用React，用create-react-app开始我的项目，所以我猜是Webpack。 - shapeless

Answer 1

如果您正在使用像webpack、rollup或其他将模块转换为单个脚本文件的工具构建此代码，那么推送到客户端的内容将严重依赖于您使用的工具。简单的构建工具只会将整个lodash输出到输出脚本上；而像rollup（也许还有webpack？）这样的工具则会对库进行一些复杂的裁剪，仅保留所使用的部分。当然，如果throttle函数依赖于lodash的其他部分，那么这些其他部分也必须被包含进来。

如果这是在客户端上运行的模块化代码（如果它是import {...} from "./lodash.js"或者使用尚未正式发布的import maps），那么情况就更加复杂了。浏览器当然需要阅读整个./lodash.js文件，否则它将无法找到该函数。但我的理解是，直到使用它们之前，函数本身的内容甚至不会被完全处理。

- Andreu Botella

---

你要找的术语是 "tree shaking"。https://www.sumcumo.com/en/tree-shaking-an-introduction - kuzdogan