Performance problem large dataset datagrid detailview

[Ellipsis]

When loading approx 1000 rows in a detailview datagrid (10 columns) the scripts are too slow. The browser complaints.

When disabling autoRowHeight we have a very small performance improvement, the add events (onExpandRow) seems to slow things down. The functions calledc send a jQuery each object to function _474 (min version). Please consider improving performance by minimizing the use of jQuery each.

see this performance test:http://jsperf.com/jquery-each-vs-for-loop/135

Pagination is no option, all the rows are needed in a single page.
Do you have any suggestions for now?

[wilfo]

Well , i think you are obligated to devided the information in two parts at least.If they 100 , tekae only 50 by 50.

Other ideas which comes to my mind , it's that you have diferentes grids ,for example grid "a" and "b" then when you select one row at that event you load the data in the grid "b" .This is valid if subgrid processing it's too low.

[Ellipsis]

That is no option, we need to render at least 1000 rows without real performance issues.

[stworthy]

The virtual scroll view can be used to display large data set. Please refer to http://www.jeasyui.com/demo/main/index.php?plugin=DataGrid&theme=default&dir=ltr&pitem=Virtual%20Scroll%20View%28Detail%20Rows%29.

Also, delay creating detail content can improve performance.

[Ellipsis]

Thank you for the answer.

But it still does not solve the problem of showing large sets of data, for example >200 rows.
The delay helped a bit, but stil the render is very slow.

[stworthy]

Please refer to this example http://www.jeasyui.com/demo/main/index.php?plugin=DataGrid&theme=default&dir=ltr&pitem=Large%20Data. It loads large data quickly.

[Ellipsis]

Yes that is correct, we do not have problems with the regulare datagrids, only the detailview extensions causes performance problems.

[stworthy]

Please download the updated detailview from http://www.jeasyui.com/extension/downloads/jquery-easyui-datagridview.zip. And define a expander column like this:

Code:

	<table class="easyui-datagrid" ...>
		<thead>
			<tr>
				<th field="e" data-options="expander:true" width="24"></th>
				<th field="inv" width="50">Inv No</th>
				<th field="date" width="50">Date</th>
				<th field="name" width="50">Name</th>
				<th field="amount" width="50" align="right">Amount</th>
				<th field="price" width="50" align="right">Price</th>
				<th field="cost" width="50" align="right">Cost</th>
				<th field="note" width="50">Note</th>
			</tr>
		</thead>
	</table>