javascript - 如何分析 Closure Compiler 包大小

Question

我有一个 ClojureScript 应用程序，它使用 Google 的 Closure Compiler 作为编译器后端。使用高级优化的结果包似乎太大了。我责怪依赖项，但我如何找出哪些模块占用了输出包中最多的字节？我扫描了所有 Closure Compiler 选项，但没有找到任何有用的东西。然后我尝试了解源映射并使用它来计算单个模块的大小，但没有成功。

我想要一个树状输出，我可以在其中挖掘并找到大小方面最大的模块，例如。

• [+] goog 100kb
  • [+] goog.net 30kb
• [+] react 90kb
• [+] 我的 50kb
  • [+] 我的命名空间 30kb

Answer 1

shadow-cljs可以生成Build Reports它采用高级编译输出并分析源映射，然后将其与一些编译器信息组合以按工件等对源进行分组。该报告生成为独立的 .html 文件。

可以找到样本构建报告 here .该构建包括来自 npm 的 “antd” 包。可以找到刚刚包含"antd/es/button" 的对比报告here .

请注意，这仅限于 shadow-cljs，因为它依赖于所有可用的源 map 数据。分析由其他工具生成的 CLJS 构建的源映射会遗漏所有 CLJSJS 内容的源映射，因此会包含很多“空白”。