[CLOSED] Performance issue on ASP.NET MVC application using ext.net

  1. #1

    [CLOSED] Performance issue on ASP.NET MVC application using ext.net

    Hi,
    We are facing some performance issues in our MVC application developed using ext.net 1.7. The components are rendered programmatically.
    We tried to time our server side processing to see if the issue is caused by our code using the Stopwatch
    class provided by .NET. The results were very conclusive and we were able to eliminate a performance issue within our code.
    Performance tests are done on one single local dev environment.

    Here one of our views within the solution

    <%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    <%@ Register Src="~/Views/item/EndTaskWindow.ascx" TagName="endTaskWin" TagPrefix="uc" %>
    <%@ Register Src="~/Views/item/CollectQuestions.ascx" TagName="collectQestionWin"
        TagPrefix="uc1" %>
    <%@ Register Src="~/Views/Item/WorkflowListWithEligibility.ascx"
        TagName="wfWindow" TagPrefix="uc2" %>
    <%@ Register Src="~/Views/Shared/SearchPopOnWindow.ascx" TagName="searchConsumerPoponWindow"
        TagPrefix="uc3" %>
    <!DOCTYPE html>
    <html>
    <head id="Head1" runat="server">
        <link type="text/css" rel="stylesheet" href="../../Resources/css/StyleManager.css" />
        <script src="../../Scripts/jquery-1.6.2.min.js" type="text/javascript"></script>
        <script src="../../Resources/js/AddTabJScript.js" type="text/javascript"></script>
        <script src="../../Resources/js/PageRefresh.js" type="text/javascript"></script>
        <script src="../../Resources/js/CollectQuestionsHandler.js" type="text/javascript"></script>
        <script src="../../Resources/js/StartWorkFlowWindow.js" type="text/javascript"></script>
        <script src="../../Resources/js/ReloadingPageAfterNotificationError.js" type="text/javascript"></script>
        <script src="../../Resources/js/collapseStreamLine.js" type="text/javascript"></script>
        <script type="text/javascript">
            /*@cc_on
            @*/   
        </script>
    </head>
    <body>
        <ext:ResourceManager ID="ResourceManager1" runat="server" SubmitDisabled="false">
            <Listeners>
                <DocumentReady Handler="onDocumentReady();" />
            </Listeners>
        </ext:ResourceManager>
        <form id="Form1" runat="server">
        </form>
        <ext:Viewport ID="Viewport1" runat="server" Layout="BorderLayout" AutoScroll="false">
            <Items>
                <ext:Panel runat="server" ID="_toolBar" Region="North" Height="30" Border="false">
                    <AutoLoad Url="/ViewEngine/LoadMainItemToolBar" NoCache="true">
                        <Params>
                            <ext:Parameter Name="containerID" Value="#{_toolBar}" Mode="Value" />
                            <ext:Parameter Name="tagName" Value="item" Mode="Value" />
                            <ext:Parameter Name="mainItemID" Value='<%# ViewBag.transactionId %>' AutoDataBind="true"
                                Mode="Value" />
                            <ext:Parameter Name="taskID" Value='<%# ViewBag.taskID %>' AutoDataBind="true" Mode="Value" />
                        </Params>
                    </AutoLoad>
                </ext:Panel>
                <ext:Panel ID="_pnlitemDetails" runat="server" Border="false" Header="false"
                    AutoScroll="true" Region="Center">
                    <AutoLoad Url="/ViewEngine/LoadPanelContent" NoCache="true">
                        <Params>
                            <ext:Parameter Name="containerID" Value="#{_pnlitemDetails}" Mode="Value" />
                            <ext:Parameter Name="tagName" Value="item" Mode="Value" />
                            <ext:Parameter Name="id" Value='<%# ViewBag.transactionId %>' AutoDataBind="true"
                                Mode="Value" />
                            <ext:Parameter Name="taskID" Value='<%# ViewBag.taskID %>' AutoDataBind="true" Mode="Value" />
                        </Params>
                    </AutoLoad>
                </ext:Panel>
                <ext:Hidden ID="_controllerName" runat="server" />
                <ext:Hidden ID="poponFieldID" runat="server" />
                <ext:Hidden ID="hiddenFieldDisplayPropertyID" runat="server" />
            </Items>
            <Content>
                <div id="win_div" />
                <uc1:collectQestionWin ID="collectQestionWin" runat="server" />
                <uc2:wfWindow ID="wfWindow" runat="server" />
                <uc:endTaskWin ID="endTaskWin" runat="server" />
            </Content>
        </ext:Viewport>
    </body>
    </html>
    It contains two panels that are using autoload and here we face the first problem: The ajax request for the autoload is taking a little more time than expected. I mean the server side treatment is estimated by TimeWatch class to 400 ms at most while the Firebux logs about 6 seconds of treatement as shown in the print screen below.

    Click image for larger version. 

Name:	AjaxRequest.png 
Views:	23 
Size:	64.4 KB 
ID:	6983

    Add to that, we are facing a render lagging (empty panel) that takes at least 6 seconds in which no ajax request is executed as logged within firebug (or may be the ajax request is blocked). This lag is really problematic for the end user experience!

    Then the screen is rendered and combo's store are loaded using HttProxy, but here too the Ajax request is taking too much time than expected. The server side treatment is about (2ms per combo box on average) while the request ajax execution time can take 3 seconds per combo which is too long as shown below.

    Click image for larger version. 

Name:	AjaxRequest2.png 
Views:	19 
Size:	27.7 KB 
ID:	6984

    We thought that the problem came from the max http request property within the browser but changing the value from 6 to 100 within firefox didn't resolve the problem.

    So, to recap we would try to find a solution for the lag. We would like also to know why the ajax requests are taking more than the expected execution time.

    Your help is really appreciated as this is becoming an urgent (showstopper) performance issue in our production environment.

    Thank you in advance,
    Last edited by Daniil; Oct 15, 2013 at 7:31 AM. Reason: [CLOSED]
  2. #2
    Hello!

    We don't see your pictures. Where did you test? On IIS Express or IIS? And what version of IIS?
  3. #3
    Quote Originally Posted by Baidaly View Post
    Hello!

    We don't see your pictures. Where did you test? On IIS Express or IIS? And what version of IIS?
    The version of IIS is 7

    Thanks in advance
  4. #4
    It's difficult to say where is the problem without a runnable sample to reproduce. Can you provide one?
  5. #5
    Hi everybody,

    I mean the server side treatment is estimated by TimeWatch class to 400 ms
    I have never used TimeWatch before. Could you, please, clarify it shows the time of execution of, for example, the LoadMainItemToolBar action? Or all the server time of request processing?

    By the way, let's do not forget about the network latency. Can we exclude this factor?
  6. #6
    Quote Originally Posted by Daniil View Post
    Hi everybody,

    I mean the server side treatment is estimated by TimeWatch class to 400 ms
    I have never used TimeWatch before. Could you, please, clarify it shows the time of execution of, for example, the LoadMainItemToolBar action? Or all the server time of request processing?

    By the way, let's do not forget about the network latency. Can we exclude this factor?
    All tests were performed on a dev machine running all required services and components, so we can exclude network latency factor.
    Our application architecture is complex, we will try to create a simple project case and will get back to you.

    Thanks
  7. #7
    Sorry to butt in on this thread. One thing I noticed was the client side logging was just Firebug. It is quite well known that Firebug can slow down applications (it is a complex, non-native plugin, and Ext JS/Ext.NET JavaScript are big libraries, so combining the two probably results in even more resource demands from the browser/plugins).

    Have you tried similar measurements in Chrome or IE10/11 using their built-in dev tools (which are native) and seen similar results?

    I have a very complex Ext.NET application and in v 1.x I have not seen a similar type of perf degradation that you mention, though from time to time with Firebug (and Illuminations for Developers) constantly open, memory and responsiveness of Firefox does degrade. I simply restart the browser in that situation. Another possibility is to also close Firebug (make sure it is greyed out) and reload the page and try again, or use a different Firefox profile without any other extensions/plugins just to eliminate that side of things?

    Hope that helps.
  8. #8
    Thank you anup, all suggestions are more than welcome.

    Actually, Tests are performed under firefox (no firebug), IE8+ and Chrome.
    Firebug logs were used during this post to help giving as much details and information as possible to help analyzing the issue.
    So basically, rendering lag is noticed under Firefox, IE8+ and Chrome.

Similar Threads

  1. Tab Panel Performance Issue
    By ITECH-Developer in forum 1.x Help
    Replies: 12
    Last Post: Jun 24, 2013, 12:00 PM
  2. [CLOSED] GridPanel Performance Issue
    By shaileshsakaria in forum 2.x Premium Help
    Replies: 2
    Last Post: Apr 03, 2013, 8:12 AM
  3. [CLOSED] Performance Issue with CommandColumn
    By blueworld in forum 2.x Premium Help
    Replies: 5
    Last Post: Dec 04, 2012, 4:52 PM
  4. [CLOSED] Application Performance
    By Hari_CSC in forum 1.x Premium Help
    Replies: 5
    Last Post: Mar 14, 2010, 7:11 PM
  5. [CLOSED] Performance issue with 0.8
    By reinout.mechant@imprss.be in forum 1.x Premium Help
    Replies: 13
    Last Post: Mar 26, 2009, 8:31 PM

Posting Permissions