main.bundle.js大小在Angular 4中占用太多负载

时间:2018-01-27 10:18:50

标签: javascript angular typescript npm

我使用的是Angular 5.2.2版本,当新用户第一次点击我的实时应用程序时,需要花费太多时间;这个main.bundle.js背后的原因太大了,因此需要比平常更多的时间。

我申请了" ng build --prod"以及一些组件的延迟加载,但它没有工作。 我还删除了应用程序中的冗余组件,资产等,但它也无法正常工作。

任何人都可以建议我能做什么 提前致谢 亚西尔

3 个答案:

答案 0 :(得分:2)

我遇到了同样的问题,因为我没有使用延迟加载。延迟加载是一种将应用程序分离到不同模块中的技术,这些模块仅在应用程序需要时才需要。 Lazy loading Angular's official documentation

在我的情况下,我为每个父网址路由创建了一个模块(例如/ car - >创建模块,/ car /:id - >将其包含在您的汽车模块中)。有了这个策略,我现在的加载时间大约是3秒。但以前大概是12秒左右。

答案 1 :(得分:0)

首先,确定你的那个慢是由main.bundle.js文件引起的吗?它的大小是什么?

延迟加载的模块通常应该有帮助,如指出

独立于角度,请确保在您的网络服务器上启用压缩(nginx或nodejs或您使用的任何内容)

对于nodejs

https://github.com/expressjs/compression

对于nginx

https://www.nginx.com/resources/admin-guide/compression-and-decompression/

答案 2 :(得分:0)

您可以尝试提前编译,这将使您的包大小更小。

ng build --prod --aot

这将从捆绑包中删除编译器代码,如果未在模板中使用,还会删除任何未使用的功能,如ngSwitch或ngIf。