使用 gzip 进行角度构建压缩答案

【问题标题】：Angular build compression with gzip使用 gzip 进行角度构建压缩
【发布时间】：2020-12-13 11:14:57
【问题描述】：

如何减小我的角度构建尺寸。我不确定我该怎么做，我应该使用 gzip 吗？

现在我主要关心的是如何减少我的 main.js 文件这里是构建屏幕截图 - https://snipboard.io/LkJMSe.jpg，因为我的网站需要大约 60-70 秒来加载这里是加载 main.js 的总时间 - https://snipboard.io/xGyRi0.jpg。我正在使用带有 IIS 10 的 Windows VPS。

我不知道我该怎么做。

谢谢

【问题讨论】：

一种选择是尽可能多地延迟加载，并确保从 lodash 等昂贵的库中导入的内容不超过应有的内容。

标签： angular build compression gzip iis-10

【解决方案1】：

Gzip 不会干扰Angular Build process。它是 IIS 中的内置功能。在 IIS 中启用 GZip 很简单，只需检查 IIS 压缩模块中的以下选项即可。
如果 IIS 中没有压缩模块，请在 Windows 功能中启用它。

请参考官方文档。
https://docs.microsoft.com/en-us/previous-versions/windows/it-pro/windows-server-2012-R2-and-2012/hh831370(v=ws.11)?redirectedfrom=MSDN
在IIS网站启用后，我们可以打开开发者控制台的网络选项卡进行验证，在“Response Headers”，Content-Encoding字段会出现“GZip”标志。

此外，还有其他方法可以减少 bundle 大小，例如延迟加载，在下面的博客中提到。
https://medium.com/angular-in-depth/optimize-angular-bundle-size-in-4-steps-4a3b3737bf45
https://angular.io/guide/lazy-loading-ngmodules

【讨论】：

压缩是否根据用户请求即时进行？它会影响服务器性能吗？因为我只有单核 VPS。
没关系。只要网站用户不太多，差别不大。