Angular 7：如何减小 vendorjs（@angular/... 包）的大小以缩短页面加载时间？答案

【问题标题】：Angular 7: How can I reduce the vendorjs (@angular/... packages) size to improve page load time?Angular 7：如何减小 vendorjs（@angular/... 包）的大小以缩短页面加载时间？
【发布时间】：2020-12-19 05:51:21
【问题描述】：

所以，我在这里搜索了这个，并尝试了大多数解决方案。但是，我没有得到任何具体的。问题是 vendorjs 大小约为 1 MB，如果我只考虑 Angular（核心？）包，并且在屏幕上显示任何内容之前加载此文件。这意味着，我们必须等待服务器提供 1 Mb+ 的文件，然后用户（国王）才能在应用程序中执行任何有用的操作。
我不知道我是否做错了什么。如果我不能减小尺寸，还有其他解决方法吗？我不关心大小，只要应用程序快速加载，并且（sideload？）这些核心包。实际大小要大得多，但我想专注于 Angular 包。

请不要提供任何与gzip相关的解决方案，因为（我可能在这里错了），这需要在服务器中设置吗？而且我无法控制服务器配置。

我使用 source-map-explorer 来计算尺寸： vendorjs-size-distribution

编辑：顺便说一句，这是来自 json 包：
"@agm/core": "1.0.0-beta.5",
"@angular/animations": "7.0.3",
"@angular/cdk": "7.0.3",
"@angular/common": "7.0.3",
"@angular/compiler": "7.0.3",
"@angular/core": "7.0.3",
"@angular/elements": "^7.2.0",
"@angular/flex-layout": "7.0.0-beta.19",
"@angular/forms": "7.0.3",
"@angular/http": "7.0.3",
"@angular/material": "7.0.3",
"@angular/platform-browser": "7.0.3",
"@angular/platform-browser-dynamic": "7.0.3",
"@angular/router": "7.0.3",

【问题讨论】：

升级到 Angular 10 应该会减小尺寸
阅读indepth.dev/angular-with-ivy-build-performance-review
我无法升级当前项目。需要 Angular 7 的解决方法。
角度更新的主要特点是尺寸减小，因为你不能这样做，我建议尝试减少使用的库。
我会尝试从@angular 包中删除一些。但是，我认为这不会对这个“大”问题产生太大影响。 @angular/material 包本身大于 300 kb。

标签： angular angular7 filesize vendor page-load-time

【解决方案1】：

所以，我已经升级到 Angular 11。所以，我不知道内部情况。但我没有注意到太多改进（这是主观的）。但是，我相信 Angular 核心包本身有 500kb 的大小。这会在任何页面绘制之前加载。有时间我会发布 webpack-analyzer 结果。所以，据我所知，没有办法解决这个问题:)

附：这对我们的项目影响不大，因为它是内部应用程序，而且网络大部分时间都足够好。

编辑： source-map-explorer 有一些问题，所以结束了

使用 webpack-bundle-analyzer 获取包大小： @angular bundle size core.js size

@angular:991.56kb

素材：398.24kb
core.js:117.8kb
cdk:178.49kb

【讨论】：

请在您的回答中提供更多详细信息。正如目前所写的那样，很难理解您的解决方案。
有时间我会发布 webpack-analyzer 结果。