请解释Webpack LimitChunkCountPlugin,MinChunkSizePlugin和AggressiveMergingPlugin

黒い雪*_*黒い雪 22 javascript webpack

我发现了的WebPack的选项的说明LimitChunkCountPlugin,MinChunkSizePlugin以及AggressiveMergingPlugin是有点混乱.有些是不言自明的,但有些是非常模糊的.

在LimitChunkCountPlugin中,我提供了3个选项:

options.maxChunks (数量)最大块数

options.chunkOverhead (number)每个块的额外开销(以字节为单位)(默认为10000,以反映请求延迟)

options.entryChunkMultiplicator (数字)一个用于输入块的乘数(默认值为10,输入块的合并次数减少10倍)

  • 所以maxChunks非常明显
  • 我不知道chunkOverhead是什么声音它会向块中添加10,000个空字节来反映一个delay??? 这毫无意义
  • entryChunkMultiplicator不是那么模糊,但仍然很模糊.我猜是一个抽象数字,其中越高的条目块(在我的情况下只有1个条目块)将被合并到另一个块中的可能性越小

在MinChunkSizePlugin中,我提供了一个选项

合并低于此最小尺寸的小块(以字符为单位).尺寸近似.

options.minChunkSize (数字)将合并小于此数字的块

所以char有多大,ascii char是1字节但是utf-8和utf-16最多可以是2个字节(如果我是正确的话).我猜我们将使用1-char到1-byte,在这种情况下,1024例如是1kb.其他人使用什么价值?


对于AggressiveMergingPlugin

options.minSizeReduce定义块合并所需的最小尺寸减少的因素.默认为1.5,这意味着对于块合并,总大小需要减少50%.

options.moveToParents设置后,不在两个合并块中的模块将移动到块的所有父项.默认为 false.

options.entryChunkMultiplicator设置options.moveToParents时,移动到条目块会更昂贵.默认为10,这意味着移动到条目块比移动到正常块大十倍.

  • minSizeReduce 非常简单,如果块可以缩小50%或更多合并它
  • moveToParents这也很令人困惑,默认情况下设置为false会抛出红色标记,也许我不应该触摸它,但听起来它重复并将所有未共享模块移动到所有父级.如果是这样,为什么有人会使用该选项.
  • entryChunkMultiplicator这是非常抽象和模糊的,听起来,当模块被移动到一个入口块时,它的访问速度要慢10倍,这是不对的.我为什么要慢一点?

如果有人能提前为我解决这个问题.

Pit*_*den 2

LimitChunkCount插件

在编写代码时,您可能已经添加了许多代码分割点来按需加载内容。编译后,您可能会注意到某些块太小 - 产生更大的 HTTP 开销。幸运的是,这个插件可以通过合并块来对它们进行后处理。

MinChunkSize插件

通过合并小于minChunkSize.

积极的合并插件

实际上在您可能使用的最新 API 中不存在。也许这个