Bundle Size在构建时显示较小的大小，但是在浏览器中它很大

Question

在浏览器上的加载时间非常长，我认为这是由于生成的包的大小所致

我在命令中键入

ng build --prod --aot --vendor-chunk --common-chunk --delete-output-path --buildOptimizer 准备我的构建，捆绑包的大小显示的很小，但是在浏览器中查看 捆绑包仍然很高 see the images here.

Answer 1

据我所见，由于加载了媒体文件（图像），因此大大降低了加载速度。您可以尝试延迟加载图像，也可以使用webp代替png或jpg。但是，对于webp图像，您应该注意browser support。

此外，我建议您只使用生产构建命令

ng build --prod 

无需生成供应商块。

此外，您可能需要检查是否已启用路由的延迟加载。

最后但并非最不重要的一点是，您可能希望将生成的文件压缩为gzip / brotli压缩格式，因为它们也会大大减小整体捆绑包的大小。