javascript ng build -prod vs ng build --prod --build-optimizer=true
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/48592332/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
ng build -prod vs ng build --prod --build-optimizer=true
提问by Lahar Shah
My Angular project is @Angular4.3.3
我的 Angular 项目是@Angular4.3.3
ng build -prod
ng build -prod
Takes 77 seconds to make a build
构建构建需要 77 秒
ng build --prod --build-optimizer=true
ng build --prod --build-optimizer=true
Takes 190 seconds to make a build, No vendor chunk, less in size(but not big difference in size though)
构建需要 190 秒，没有供应商块，尺寸更小（但尺寸差异不大）
Chunk differences on console image:
控制台图像上的块差异：
I read Bundling & Tree-Shakingbut still don't get the clear difference between builds created by those commands.
我阅读了Bundling & Tree-Shaking，但仍然没有得到这些命令创建的构建之间的明显区别。
Why there are these two different ways and what are the difference in performance or any other way?
为什么有这两种不同的方式，性能或其他方式有什么区别？
回答by suprandr
--build-optimizer and --vendor-chunk
From Angular CLI Docs:
When using Build Optimizer the vendor chunk will be disabled by default. You can override this with --vendor-chunk=true.
Total bundle sizes with Build Optimizer are smaller if there is no separate vendor chunk because having vendor code in the same chunk as app code makes it possible for Uglify to remove more unused code.
使用构建优化器时，默认情况下将禁用供应商块。您可以使用 --vendor-chunk=true 覆盖它。
如果没有单独的供应商块，构建优化器的总包大小会更小，因为供应商代码与应用程序代码位于同一块中，这使得 Uglify 可以删除更多未使用的代码。
回答by Simon_Weaver
First of all why is vendor chunkuseful in the first place?
首先为什么vendor chunk有用？
vendor.jsis most useful during development because you're updating yourcode far more frequently than you're downloading a new framework or updating npm packages.
vendor.js因为你要更新是发展过程中最有用的频繁得多的代码比你下载一个新的框架或更新NPM包。
Therefore compile time is faster during development with vendor chunk enabled.
因此，在启用供应商块的开发过程中，编译时间更快。
As for why is --vendor-chunkeven an option? This is off the top of my head but:
至于为什么是--vendor-chunk一个选项？这是我的头顶，但：
- If your app has a lot of users on a slow connection and you frequently update it then it may be advantageous to have a larger vendor chunk that remains unchanged for longer. When updating your app then the chunks will be smaller. This will not give you fully optimized (tree shaken) app, but in very specific circumstances it could be useful. [This assumes you're using fingerprinting where the filename is literally a checksum/hash of the contents of the file - so if it doesn't change then the file can be cached.]
- Very occasionally there can be subtle bugs in your code that only become apparent when minimizing code in a certain way. This may be due to relying on a method/class name that gets 'optimized out'. So you may have to enable vendor chunk in production if you have such a bug (while you fix it).
- Enable vendor chunk deliberately to make your app slower to load - then tell your boss you're working late to optimize it - and disable it ;-)
- Why not? People like to play!
- 如果您的应用程序有很多用户的连接速度很慢，并且您经常更新它，那么拥有更大的供应商块并保持更长时间不变可能是有利的。更新您的应用程序时，块会更小。这不会为您提供完全优化（摇树）的应用程序，但在非常特定的情况下它可能很有用。[这假设您正在使用指纹识别，其中文件名实际上是文件内容的校验和/哈希 - 因此，如果它没有更改，则可以缓存该文件。]
- 偶尔，您的代码中可能会存在细微的错误，这些错误只有在以某种方式最小化代码时才会变得明显。这可能是由于依赖于“优化”的方法/类名称。因此，如果您有这样的错误（在修复它时），您可能必须在生产中启用供应商块。
- 故意启用供应商块以降低您的应用程序的加载速度 - 然后告诉您的老板您正在加班以优化它 - 并禁用它;-)
- 为什么不？人们喜欢玩！
