角+离子加载通过XHR
问题描述:
的所有内容,我们有一个角+离子的应用程序,我们计划通过科尔多瓦运行,但与我们试图追查性能问题。角+离子加载通过XHR
我们正在运行在本地或内置应用程序时,看到在Chrome浏览器开发工具网络选项卡,如下:
- CSS的重复装载
- XHR请求获得每一个模板文件我们角UI路由器链接,而不必访问路线尚未
举个例子:
和线路3167(带星号表示)从angular.js来源:
append: function(element, node) {
var nodeType = element.nodeType;
if (nodeType !== NODE_TYPE_ELEMENT && nodeType !== NODE_TYPE_DOCUMENT_FRAGMENT) return;
node = new JQLite(node);
for (var i = 0, ii = node.length; i < ii; i++) {
var child = node[i];
element.appendChild(child); *
}
},
我从来没有见过这样的事情 - 我们已经检查了所有的基本知识(重复的脚本/ CSS包括,等等),禁用离子缓存等。
我正在剥离东西到螺柱,看看是什么可能导致这种情况,但希望别人看到了这一点,并可以提供一些建议,从哪里开始寻找。
UPDATE
重复的CSS似乎是由于其自举我们的角应用程序被错误地指出,作为UI路由器配置的状态我们的index.html文件。
所以根本的问题是虚假/意外XHR拉到所有的应用程序中的静态文件(角UI模板,模板指令)的。
答
那么,当一个状态被激活时,模板自动插入到其父状态的模板的用户界面视图。
你应该检查你是如何定义你的状态的。和/或与我们分享你的状态定义:)
答
我处理HTML模板的方法是使用一饮而尽-NG-模板或呼噜声,角模板缓存它们全部在编译时(根据任务管理器的哪种香味你像现在一样)。
由于我们正在处理应用程序,因此内容应该更好地加载而不是延迟加载(只要您以MB为单位计算其总大小),从而节省一些带宽并改善整体用户体验。另外它可能只是解决你的问题。
在编译时缓存模板的美妙之处在于你的实现并不需要知道他们是从(服务器或缓存层)来了,这样的话你不需要更改任何代码。
P.S.我明白我的答案不会解决您的实际问题,但它可能同时解决2个问题。
为什么您的index.html会被XHR请求重新加载? –
@AndrewMcGivery - 更新的问题 - 用户界面路由器被错误地指向index.html文件,一切都在路由器是通过XHR –
获得“预加载”没有足够的信息来诊断问题。你可以在Plunker中复制这个问题吗? – Phil