Performance Angular2加载顺序导致初始页面加载缓慢

我创建了angular2项目，并在我的初始页面上添加了几个角度组件。其中一些加载图像-速度相对较慢，但实际问题是：

我有一个很大的包（~1mb），我目前正在努力使它更小

初始加载只发出几个请求，加载包（通常约3秒），然后等待Angular应用程序启动（约1.4秒）。之后，它开始加载所有组件并加载它们的资源（字体、图像等）。以下是请求的外观：

我担心，即使在我减小捆绑包大小后，应用程序仍会在不发出任何请求的情况下启动1.5秒，然后再次等待~1秒，以加载组件的资源。我认为这将导致大约3秒以上的加载时间。由于我的应用程序相对简单，我觉得这是不可接受的

问题1：是否有一种方法可以提前加载组件资源，并在组件加载时引用它们

问题2：有没有办法让应用程序引导更快

我也愿意接受其他建议：）

编辑：

我使用的是AoT编译，这是seed提供的，我已经采取措施降低了

app.js

文件的大小。问题仍然存在于下载的

app.js

的结尾和第一个组件的资源调用之间的间隙。

更新（2016-12-19）： 我所做的（目前）仅在服务器上：

• 启用了HTTP2支持，从而大大提高了速度
• 启用了GZIP，将JS的大小减少了5倍以上

在NGINX和Apache上，这些服务器配置微不足道，因此值得一试

现在，尽管站点加载速度快了很多，但这些更改并不能解决最初的问题（问题1和问题2）。因此，我正在寻找一些其他方法，如果您处于我的位置，您可能也希望遵循这些方法：

• -一些见解

更新（2018-06-11）： 以下是一些帮助我提高初始负荷的材料：

---

在我的例子中，延迟加载扮演着重要的角色。

Q2：通过实现提前编译，您可以加快应用程序引导速度并减少捆绑包大小：

就像听起来一样，模板是预先编译的，所有脚本都是预先生成的，这减少了初始加载后的处理时间。此外，Angular 2编译器不包括在您的包中，这将大大减少包本身的大小

---

Q1：有对组件的延迟加载支持，但我还没有研究它需要什么，其他人可能会为您回答这一部分。

考虑到js的缩小/捆绑，在服务器端启用压缩将减少加载时间。

购买DNS，我们能够将加载时间从50秒减少到4秒。还可以将刷新速度降低到1秒左右

---

它有一个免费版本，可以正常工作。

你是否设法让你的应用程序更快了？我最近使用了延迟加载路由，这稍微缩短了我的加载时间，但仍然是slowI更新了答案，以包括到目前为止我所做的工作。对于启用的HTTP2，您是如何做到的？我使用cloudflare，我认为它包括启用的HTTP2。这是一种服务器配置。我不知道你在cloudflare上是怎么做到的。谷歌是你的朋友。我也遇到了同样的问题……你对上述问题有什么解决方案吗？我正在使用angular2和systemjs，并使用延迟加载路由。我发现该应用程序在桌面上引导需要4秒，在android/mobile上引导需要12秒，在iPhone上引导需要5秒。你知道我可以将我的应用程序移动到哪些好的种子应用程序来提高加载速度吗？我需要更快地加载我的应用程序。