100% CPU after grid is displayed

I am currently using 2.0.2 Standard Edition. I am running the following code to test the performance of the grid.

<cfset variable.myData = "">



<html>

<head>



<!-- include links to the script and stylesheet files -->

    <script src="../runtime/lib/aw.js"></script>

    <link href="../runtime/styles/xp/aw.css" rel="stylesheet"></link>



</head>

<body>

    <h3>100 Columns; No Coloring; Text Only; Array; Extended Grid</h3>



<!-- insert control tag -->

    <span id="myGrid"></span>

<cfloop index="inLoop" from="1" to="100"></cfloop>

<!-- create controls -->

<script>



    var d1, d2; 



    d1 = new Date(); 



    var myData = [<cfloop index="outLoop" from="1" to="1000">[<cfloop index="inLoop" from="1" to="100">"1"<cfif (inLoop neq 100)>,</cfif></cfloop>]<cfif (outLoop neq 1000)>,</cfif></cfloop>]



    var grid = new AW.Grid.Extended;

    grid.setId("myGrid");

    grid.setHeaderText("header");

    grid.setCellText(myData);

    grid.setColumnCount(100);

    grid.setRowCount(1000);

    grid.refresh();



    grid.onScrollTopChanged = function(){ 

        d1 = new Date(); 

    } 



    grid.onVirtualTopChanged = function(){ 

        window.setTimeout(function(){ 

            d2 = new Date(); 

            window.status = "Rows repainted in " + (d2-d1-200) + " ms"; 

            // minus 200 ms inactivity threshold 

        }); 

    }

    

</script>

</body>

</html>

The CFTags are part of ColdFusion's CFML and are generating a JavaScript array of 1000 Rows X 100 Column. The grid displays in about 14 seconds. This seems to be the expected time for the number of columns. What I have a question about is after the grid displays there is a delay where the CPU is still running at 100%. I know when the process is complete because my debug information will then be displayed.

With this, here is my issue and question. Using the code above the delay after the grid is around 10 seconds. With the code I intend to use for my actual application, the delay averages about 45 seconds. This is causing the delay to be too long and will cause the customer to reject the grid. So, what is going on during this delay? and is there an event in the grid I could track to tell me when it is complete?

Release it every after every page load...grid=null.

The grid renders rows in two phases. First, it renders the visible rows - this is the first delay until some data is visible. Then, the grid renders additional rows below and above the visible area. Normally this is non-blocking process as the rows are rendered one-by-one with small timeout between them. However with 100 columns this will likely to block the browser due to large repaint time (this might be the second delay after the data is already visible).

It would be useful to create horizontal virtual mode rendering only visible columns.

Thank you Alex for your response. Its great to learn these inner workings of the grid. I do have one additional question: Is there an event I could listen to which would let me know when this second phase is complete?

Is there a way to disable or increase the timeout for the second phase?

Another alternative would be to delay the second phase until the grid gets focus. In a lot of scenarios our users will never scroll so the second phase is unnecessary.

Forum search