Flex execution timeout in AdvancedDataGrid - apache-flex

Question

I've a problem, I'm using an AdvancedDataGrid .
It loads about 3000 records with about 20 columns. I constantly get Flex execution timeout because the grid executes a lot inside LayoutManager.
How can I make it asyncronousely or faster at all?

Answer 1

Use Datagrid pagination.
http://gurufaction.blogspot.com/2007/02/flex-datagrid-paging-example-with.html
http://stackoverflow.com/questions/1893350/how-does-flex-3-datagrid-paging-work
or something like this
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="InitApp()" xmlns:MyComp="*">
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.events.ItemClickEvent;
[Bindable]
public var myData:ArrayCollection = new ArrayCollection();
public var orgData:ArrayCollection = new ArrayCollection();
[Bindable]
public var nav:ArrayCollection = new ArrayCollection();
private var index:int = 0;
private var page:int = 25;
private var paging:Boolean = true;
private function InitApp():void {
for( var x:uint = 1; x <= 500; x++ ) {
var obj:Object = new Object();
obj.Id = x.toString();
obj.Name = "Column " + x.toString();
obj.Street = "5555 Street";
obj.Title = "CEO";
obj.City = "El Paso";
orgData.addItem(obj);
}
refreshDataProvider(0);
}
private function navPage(d:int):void {
index += d;
refreshDataProvider(index);
}
private function refreshDataProvider(start:int):void {
if (paging == true) {
page = 25;
myData = new ArrayCollection(orgData.source.slice(start,start+page));
}
else {
index = 0;
page = 500;
myData = new ArrayCollection(orgData.source);
}
down.enabled = index > 0;
up.enabled = index + page < orgData.length;
lbl.text = index.toString() + ' to ' + (index + page).toString() + ' of ' + orgData.length;
}
private function togglePaging():void {
paging = !paging;
toggle.label = paging.toString();
refreshDataProvider(index);
}
]]>
</mx:Script>
<mx:DataGrid id="dg" dataProvider="{myData}" width="510" height="202"></mx:DataGrid>
<mx:Button x="10" y="210" label="<" click="navPage(-25);" id="down"/>
<mx:Button x="216" y="210" label=">" click="navPage(25);" id="up"/>
<mx:Label x="58" y="212" text="page" width="150" id="lbl"/>
<mx:Button x="264" y="210" label="true" id="toggle" click="togglePaging();"/>
</mx:Application>

Answer 2

Load the data a chunk at a time? Say slightly more than however many rows are shown visually. That way you get the perceived performance that it renders quickly.
3000 records is a lot to be loading in one go it has to be said...