Jan 20, 2010, 1:16 PM
Performance issues in Firefox & Chrome (works well in IE8 and Opera 10)
Hi there.
I'm writing a closed-source application, in which all Coolite components are created programmatically. This is required to protect my code upon distribution. I will acquire a commercial license after I ported my application to the 1.0 Coolite codebase & when the performance issues I'm addressing in this topic are solved.
I will try to give you a thorough context on how the application is build, and where I encounter performance problems.
The main page (Default.aspx) loads a viewport, with a Async TreePanel in the west Panel, and a TabPanel in the center Panel. Upon clicking on a node, a seperate page is loaded (containing a viewport with a gridpanel) in a new tab in the center panel. I use the following Javascript to accomplish this:
1. Upon Loading the page the first time, Coolite images load in parts, the nodes in the tree load, and after that the node icons, which looks very laggy and slome. This is not the case in IE8 & Opera 10... I do register the node icons in the Page_Load section:
I'm quit desperate atm, since I seem to be the only one having performance issues in Firefox (normally, it is the other way around with ExtJS). Is it cause I programmatically create everything in code-behind? I do not want to use Loadmasks every second, as performance (speed of the application) is the most important for me. I'd like to accomplish the same effect as when I browse the app in IE8 & Opera 10.
Thank you in advance for looking into this problem.
I'm writing a closed-source application, in which all Coolite components are created programmatically. This is required to protect my code upon distribution. I will acquire a commercial license after I ported my application to the 1.0 Coolite codebase & when the performance issues I'm addressing in this topic are solved.
I will try to give you a thorough context on how the application is build, and where I encounter performance problems.
The main page (Default.aspx) loads a viewport, with a Async TreePanel in the west Panel, and a TabPanel in the center Panel. Upon clicking on a node, a seperate page is loaded (containing a viewport with a gridpanel) in a new tab in the center panel. I use the following Javascript to accomplish this:
var tab = tabPanel.getItem(node.id);
if (!tab)
{
tab = tabPanel.add(
{
id: node.id,
title: node.text,
closable: true,
autoLoad:
{
url: 'ViewportWithGrid.aspx?id=' + node.attributes.href,
mode: 'iframe'
}
});
tabPanel.setActiveTab(tab);
tabPanel.doLayout();
}
I seem to have 2 major bottlenecks in Firefox & Chrome (Basically Webkit/Gecko based browsers, I recon)1. Upon Loading the page the first time, Coolite images load in parts, the nodes in the tree load, and after that the node icons, which looks very laggy and slome. This is not the case in IE8 & Opera 10... I do register the node icons in the Page_Load section:
if (!Ext.IsAjaxRequest && !IsPostBack)
{
... // ScriptManager init etc
scriptManager.RegisterIcon(Icon.Folder);
... // Building the viewport etc
}
2. When clicking on a node, it takes 4 to 5 seconds to load the viewport and another 1 to 3 seconds to load the grid. This is all instant in IE & Opera (Ironic, cause Firefox is suppose to handle Iframes better and faster than IE).I'm quit desperate atm, since I seem to be the only one having performance issues in Firefox (normally, it is the other way around with ExtJS). Is it cause I programmatically create everything in code-behind? I do not want to use Loadmasks every second, as performance (speed of the application) is the most important for me. I'd like to accomplish the same effect as when I browse the app in IE8 & Opera 10.
Thank you in advance for looking into this problem.