Question

My Angular项目是@ Angular4.3.3

ng build -prod

制作构建需要77秒

ng build --prod --build-optimizer = true

制作构建需要190秒，没有供应商大块，尺寸较小（但是尺寸差别不大）

控制台映像上的块差异：

我阅读Bundling & Tree-Shaking但仍然没有明确区分这些命令创建的构建。

为什么有这两种不同的方式，性能或其他方式有何不同？

Answer 1

--build-optimizer and --vendor-chunk

“使用Build Optimizer时，默认情况下将禁用供应商块。您可以使用--vendor-chunk = true覆盖它。

如果没有单独的供应商块，则使用Build Optimizer的总包大小会较小，因为将供应商代码与应用程序代码放在同一块中，这样Uglify就有可能删除更多未使用的代码。

Answer 2

vendor.js在开发期间最有用，因为与下载新框架或更新npm软件包相比，您更新代码的频率要高得多。

因此，在启用供应商块的情况下，开发过程中的编译时间更快。

至于为什么--vendor-chunk甚至是一个选择？这不在我的头上，但是：

如果您的应用有很多用户连接速度很慢，并且您经常更新它，那么拥有较大的供应商块并保持更长的时间可能是有利的。在更新您的应用程序时，块将较小。这不会为您提供经过完全优化（摇摇晃晃的）的应用程序，但是在非常特殊的情况下它可能会很有用。 [这假设您正在使用指纹识别，其中文件名实际上是文件内容的校验和/哈希-因此，如果不更改，则可以缓存文件。]
有时，您的代码中可能会包含一些细微的错误，这些错误仅在以某种方式最小化代码时才变得明显。这可能是由于依赖于“优化”的方法/类名。因此，如果您有这样的错误（在修复时），则可能必须在生产中启用供应商数据块。
故意启用供应商数据块，以使您的应用加载速度变慢-然后告诉老板您正在努力优化它-并禁用它;-）
为什么不呢？人们喜欢玩！