任何人都可以帮助我吗?
My Angular 2应用程序需要很长时间才能初始化。
只有16个请求。 尽管3 mb的尺寸相对较大,但问题不在于带来文件。
我指的是获取所有文件后的时间。
在我的笔记本上是3到4秒,我认为这是一个很长的时间,因为我现在只有10个组件,1个管道和6个指令。
这个想法是应用程序有近200个组件。 然后我将创建延迟加载。
但对于10个组件,我认为它应该更快。 在手机上,待机时间达到10,12秒。 在iPad上,等待也相对较大。 超过15秒。
我正在使用webpack,缩小css和js。 甚至在服务器上使用预渲染(asp.net核心)。
下载所有文件后会发生此延迟。 也就是说,渲染屏幕是一个角度2处理时间。
我还能做什么? 我怎么可能做错了?
测试链接: http://projetos.codegenerator.com.br/angular2/
感谢。
答案 0 :(得分:2)
我认为您没有使用任何捆绑工具,例如webpack,systemjs ..
部署ng2-app时,应该使用AOT(提前)编译。 我猜你正在使用JIT(及时)编译。
在angular2指南页面,
使用AOT,浏览器会下载应用程序的预编译版本。浏览器加载可执行代码,以便它可以立即呈现应用程序,而无需先等待编译应用程序。
当您使用JIT编译时,您的浏览器将下载由angular2编译器定义的vendor.js,它将及时编译您的应用程序。它太慢了,客户端必须下载供应商文件。当您使用AOT时,您不必使用供应商文件,因此资源更小。
我建议在部署应用程序时使用AOT编译,并对资源大小使用延迟加载。
如果您对ng2 AOT编译感到好奇,请阅读本指南。
这是带有webpack2和延迟加载的示例angular2 app。
在这里使用文件结构和配置文件。
当我使用示例应用程序进行测试时,与aot捆绑在一起的文件小于500KB。
答案 1 :(得分:1)
Angular 2在性能方面经过了充分测试,如果在应用程序及其依赖项上存在任何滞后现象......
检查您的环境,如果只有很少的组件,那么框架方面没有任何问题。
Webpack或任何其他构建工具与性能无关,因为它们是开发依赖项,
如果您使用cdn用于某些第三方服务或图书馆,请检查他们的服务是否准时。
答案 2 :(得分:1)
我终于在应用程序中获得了我想要的性能。 它需要一些工作,但确实值得。
将您的应用程序配置为在AOT中编译,实际上性能提升是值得的。