Angular 2 页面大小

Question

我刚刚开始使用 Angular 2。它实际上让我考虑了仅用于 Hello World 的页面大小。

请查看实际需要的脚本，它已经是 1.75 MB。

Offcourse 缩小后，它大约会减少 30-35%。

然而，对于这个垃圾 Hello World 类型的应用程序来说，它仍然会超过 1 MB。以最小的方式添加引导 CSS / Jquery / Jquery UI 会进一步增加根据 Web 应用程序类型添加图像。

问题是 1.75 MB 的脚本，而无需编写与应用程序相关的任何代码行。

这是使页面大小平均超过 4-5 MB 的新 Web 标准吗？

Answer 1

有多种策略可以减少网站的总大小。

1. 为您的资源启用 gzip 压缩。大多数文本文件（如 JS 文件）由于有大量重复的字符串，压缩效果非常好。
2. 正如您所确定的，使用库的最小化版本。
3. 如果可能，请使用对第三方库的 CDN 引用。这样，用户的缓存中可能已经有该文件，不需要重新获取它。一些 CDN 还支持 HTTP/2，这意味着可以并行请求更多文件。
4. 利用 Angular 2 RC 5 中的提前编译（AOT，又名离线编译），并切换到使用不带编译器的 Angular 2 版本。这节省了 Angular 2 库文件大小的大约一半。
5. 自己将 HTTP/2 用于您的资产，并单独引用每个 JS 文件，而不是捆绑它。这样，如果它们没有改变，用户重新加载时就不需要再次下载它们。并且第一次，所有文件都可以并行获取。
6. 使用条件注释或服务器端处理来删除仅与某些浏览器（如 IE）相关的垫片和其他 JS 文件。这样，其他浏览器就不会下载那些无用的脚本。
7. 使用Rollup或其他可以进行“tree shake”的工具来删除未使用的代码。

可能还有其他方法可以节省更多，但这是一个很好的起点。