解压后的大小如何影响 npm 包的缩小后的大小？

Posted 2023-03-07

【中文标题】解压后的大小如何影响 npm 包的缩小后的大小？

【英文标题】：How does the unpacked size affect the minified size of an npm pckage?

【发布时间】：2021-06-01 05:42:56

【问题描述】：

我目前正在尝试减少我创建的 npm 包的包大小。我设法达到了大约 210kb 的解压大小。

https://www.npmjs.com/package/@agile-ts/core/v/0.0.12

https://www.npmjs.com/package/@agile-ts/core/v/0.0.11

我所做的一项更改是在“tsconfig”文件的帮助下删除所有 cmets，这将我的解压缩大小减少了大约 100kb，但缩小后的大小保持不变 (57kb)？

https://bundlephobia.com/result?p=@agile-ts/core@0.0.12

https://bundlephobia.com/result?p=@agile-ts/core@0.0.11

所以我想知道解压后的尺寸如何影响缩小后的尺寸。缩小尺寸的 cmets 是否已经移除？我在网上找不到这个问题的答案。

我发现的另一个包的解压后大小约为 325kb

https://www.npmjs.com/package/@hookstate/core

但缩小后的大小为 16.7kB。

https://bundlephobia.com/result?p=@hookstate/core@3.0.6

-> 解压后的尺寸大约大了 30%，但缩小后的尺寸小了 70%？

我发现的唯一区别是我刚才提到的包由 10 个文件组成，而我的包由 66 个文件组成。 所以它比我的包装小..但它的解压尺寸也应该更小。

如果您有任何想法如何减小包大小.. 随时贡献 ^^ 或给我一些建议 https://github.com/agile-ts/agile/issues/106

谢谢;D

【参考方案1】：

重要的不是包在磁盘上包含多少，而是在应用了所有捆绑和缩小之后在最终应用程序中占用了多少空间。这个过程包括变量名重命名、删除 cmets、tree shaking 和删除未使用/未引用的代码。有一些工具可以检查最终应用程序的大小和依赖项的大小。它们因您使用的捆绑器而异。

为了缩小包下载大小而从源代码中删除 cmets 是非常糟糕的主意。以及删除其他开发支持文件，如 Typescript 定义等。