Feb 10, 2011, 2:51 PM
Performance Issue - Simple Login Page
Hello,
I have been evaluating your Ext.Net beta release for quite a long time. Now I got approval from my project director to buy this. We are planning to commence the app development from March. But unfortunately I see performance issue when i use this library.
I designed a simple login page and we have very good server. The initial loading alone takes more than 12-14 secs. I noticed that you add 2 style files and 4 JavaScript files for this simple login page. The total size of all these files is 780KB. I have pasted a sample code for your reference and kindly let us know if I am missing anything.
If this problem is already taken care, We would like to go ahead with your tool. Kindly assist us.
I have been evaluating your Ext.Net beta release for quite a long time. Now I got approval from my project director to buy this. We are planning to commence the app development from March. But unfortunately I see performance issue when i use this library.
I designed a simple login page and we have very good server. The initial loading alone takes more than 12-14 secs. I noticed that you add 2 style files and 4 JavaScript files for this simple login page. The total size of all these files is 780KB. I have pasted a sample code for your reference and kindly let us know if I am missing anything.
If this problem is already taken care, We would like to go ahead with your tool. Kindly assist us.
<ext:ResourceManager ID="ResourceManager1" runat="server" Theme="Slate">
</ext:ResourceManager>
<ext:Viewport ID="Viewport1" runat="server">
<Items>
<ext:BorderLayout ID="BorderLayout1" runat="server">
<North>
<ext:Panel ID="Panel2" runat="server" Height="80" Border="false">
<LoadMask Msg="Loading" ShowMask="true" />
<Content>
<ext:RowLayout ID="NorthRowLayout" runat="server">
<Rows>
<ext:LayoutRow>
<ext:Panel ID="Panel1a" IDMode="Ignore" runat="server" Header="false" Border="false"
BodyStyle="color:white" StyleSpec="width:100%; color:white" Height="55">
<Content>
<ext:ColumnLayout ID="ColumnLayout1" runat="server">
<Columns>
<ext:LayoutColumn ColumnWidth="0.5">
<ext:Panel ID="Panel3" BodyStyle="background-position:bottom;background-repeat:repeat-x;background-image:url('Images/tabstrip.jpg');"
Html="<div style='background-image:url(images/xxx.png);background-position:bottom;background-position:left;background-repeat:norepeat;background-repeat:no-repeat;height:55px;width:207px'></div>"
Width="177" runat="server" Border="false">
</ext:Panel>
</ext:LayoutColumn>
<%--<ext:LayoutColumn ColumnWidth="1">
<ext:Panel ID="Panel7" BodyStyle="background-position:bottom;background-repeat:repeat-x;background-image:url('../../Images/xxx.jpg'); text-align:center"
Html="<div style='background-image:url(../../images/per.jpg);background-position:bottom;background-position:left;background-repeat:norepeat;background-repeat:no-repeat;height:74px;width:556px'></div>"
Width="556" runat="server" Border="false">
</ext:Panel>
</ext:LayoutColumn>--%>
<ext:LayoutColumn ColumnWidth="0.5">
<ext:Panel BodyStyle="background-position:bottom;background-repeat:repeat-x;background-image:url('Images/tabstrip.jpg'); color:#FFFFFF; text-align:right;"
ID="Panel6" Width="177" runat="server" Border="false">
</ext:Panel>
</ext:LayoutColumn>
</Columns>
</ext:ColumnLayout>
</Content>
</ext:Panel>
</ext:LayoutRow>
<ext:LayoutRow>
<ext:Panel ID="Panel4" IDMode="Ignore" runat="server" Header="false" Border="false"
BodyStyle="color:white" StyleSpec="width:100%; color:white" Height="30">
<Content>
<ext:ColumnLayout ID="ColumnLayout2" runat="server">
<Columns>
<ext:LayoutColumn ColumnWidth="1">
<ext:Panel ID="Panel5" BodyStyle="background-position:bottom;background-repeat:repeat-x;background-color:#3b5a76;"
Html="<div style='width:100%; text-align:center; padding-top:6px' class='whiteTxt'></div>"
Width="177" runat="server" Border="false">
</ext:Panel>
</ext:LayoutColumn>
</Columns>
</ext:ColumnLayout>
</Content>
</ext:Panel>
</ext:LayoutRow>
</Rows>
</ext:RowLayout>
</Content>
</ext:Panel>
</North>
<Center>
<ext:Panel ID="Panel1aa" runat="server" Width="350" Height="245" BodyStyle="padding:9px;text-align:center;padding-top:30px;margin:auto;background:url('Images/xxx.jpg');background-repeat:no-repeat; background-color:white; background-position:right top"
BodyBorder="false">
<Items>
<ext:FormPanel ID="frmLogin" runat="server" Width="340" Height="205" Title="Login"
BodyStyle="text-align:left; padding:9px" StyleSpec="text-align:left; margin:auto"
Icon="LockGo" LabelAlign="Left">
<Items>
<ext:TextField ID="txtUserID" runat="server" FieldLabel="Login ID" Width="200" AllowBlank="false"
StyleSpec="margin-top:2px" LabelStyle="margin-top:2px" LabelWidth="85">
</ext:TextField>
<ext:TextField ID="txtPassword" runat="server" FieldLabel="Password" InputType="Password"
Width="200" AllowBlank="false" StyleSpec="margin-top:10px;margin-bottom:10px"
LabelStyle="margin-top:10px" LabelWidth="85">
</ext:TextField>
<ext:ComboBox runat="server" FieldLabel="Student Group" Width="200" LabelWidth="85"
Editable="false" AllowBlank="false" ID="cboStudentGroup">
<Items>
<ext:ListItem Text="Student" Value="1" />
<ext:ListItem Text="Non Student" Value="2" />
</Items>
</ext:ComboBox>
<ext:Label ID="Label1" FieldLabel="Enter your login credentials to access your dashboard"
LabelStyle="width:300px; padding-top:10px; color:#3f5f7e" LabelSeparator=" "
runat="server">
</ext:Label>
</Items>
<Buttons>
<ext:Button ID="Button2" runat="server" Icon="KeyGo" Text="Login">
<Listeners>
<Click Handler="if(#{frmLogin}.getForm().isValid()){ return fnAuthentication(); }else{return false;}" />
</Listeners>
<DirectEvents>
<Click OnEvent="ValidateUser">
<EventMask Msg="Please wait" ShowMask="true" MinDelay="2000" />
</Click>
</DirectEvents>
</ext:Button>
<ext:Button ID="Button1" runat="server" Icon="Cancel" Text="Cancel">
<Listeners>
<Click Handler="#{frmLogin}.getForm().reset();" />
</Listeners>
</ext:Button>
</Buttons>
</ext:FormPanel>
<ext:FormPanel ID="FormPanel2" runat="server" Width="265" Height="175" BodyStyle="text-align:left; padding-top:9px"
StyleSpec="text-align:left; margin:auto; font-family:Arial; font-size:12px;"
LabelAlign="Left" LabelWidth="75" BodyBorder="false">
<Items>
<ext:LinkButton ID="LinkButton1" Icon="LinkEdit" Text="Forgot Password?" runat="server"
Disabled="true">
</ext:LinkButton>
</Items>
</ext:FormPanel>
</Items>
</ext:Panel>
</Center>
<South>
<ext:Panel ID="Panel1" runat="server" Height="20">
<TopBar>
<ext:Toolbar StyleSpec="color:white">
<Items>
<ext:Label ID="Label2" runat="server" FieldLabel="----------"
StyleSpec="color:white" LabelSeparator=" ">
</ext:Label>
<ext:ToolbarFill>
</ext:ToolbarFill>
<ext:Label ID="Label3" runat="server" FieldLabel="---------------------" StyleSpec="color:white"
LabelSeparator=" " Width="150">
</ext:Label>
</Items>
</ext:Toolbar>
</TopBar>
</ext:Panel>
</South>
</ext:BorderLayout>
</Items>
</ext:Viewport>
Last edited by geoffrey.mcgill; Feb 10, 2011 at 3:34 PM.
Reason: please use [CODE] tags