慢Angularjs页面初始化 - 在html加载之前的长延迟

Question

我正在运行angularjs应用，并且无法弄清楚我的网页加载速度缓慢的原因。 css和js文件都加载很快，但是在html加载之间有一个很长的延迟，在那里应用程序似乎只是暂停，什么都不做

headertemplate.jtml，footertemplate.html和notelist.html是加载组成视图的部分

Answer 1

Angular使用ajax来检索模板。您应该能够查看开发人员工具中的网络选项卡，以查看每个模板的ajax请求。这可能会让你知道什么是阻碍。

我不确定为什么花了这么长时间来接收它们，但是你可以加快速度的一种方法是使用像HTML2JS之类的工具预先缓存模板。这样，您的模板只是您包含的另一个JS文件，程序代码和模板在加载程序代码后立即加载。它会增加您的初始下载大小，但会大大提高获取模板的速度。

Answer 2

您可以在$ templateCache中缓存所有模板，这将使角度应用程序永远不会对部分htmls进行xhr请求。

https://docs.angularjs.org/api/ng/service/ $ templateCache

有各种gulp和grunt模块可以自动执行该过程。 https://www.npmjs.com/package/gulp-angular-templatecache https://github.com/ericclemmons/grunt-angular-templates

顺便说一句，你在angular.forEach中进行任何服务器调用，由于某些原因它们不会出现在网络标签中（idk为什么？o.O） 或者你可能在ui-router的状态配置中使用了解析，这需要时间来激活状态并调用html partial ..