I have a data set of around 1000 rows, 14 columns and for the table to load onto the page it takes about 17 seconds or more on avg. I'm wondering if there is anyways to optimize this. Its take too much time on first time page load after that i have used type: "local" its worked fast but first time it load whole time take too much time..

I have used virtualizationMode: "continuous" its no effect on load please help & provide any solution below is my complete code...

console.time("time");
$("#incGrid").igGrid({
dataSource: '@Url.Action("GetSearchResults")' + EmployeeFilter,
autoGenerateColumns: false,
primaryKey: "Id",
enableUTCDates: false,
rowVirtualization: true,
virtualizationMode: "continuous",
height: "800px",
width: "100%",
responseDataKey: "SearchResults",
columns: [
{ key: "Id", dataType: "number", hidden: true, width: "0%" },
{ key: "IncId", headerText: "Id", width: "6%" },
{ key: "EmployeeName", dataType: "string", headerText: "Name", width: "8%" },
{ key: "SupervisorName", dataType: "string", headerText: "Supervisor", width: "9%" },
{ key: "Title", headerText: "Title", width: "7%" },
{ key: "Department", headerText: "Dept", width: "8%" },
{ key: "Union", headerText: "Union", width: "8%" },
{ key: "IncidentDDate", headerText: "Date", dataType: "date", format: "MM/dd/yyyy", width: "7%"},
{ key: "Status", headerText: "Status", width: "8%" },
{ key: "Abeyance", headerText: "Abeyance", width: "7%"},
{ key: "Action", headerText: "Action", width: "8%" },
{ key: "Details", headerText: "Details", width: "16%" },
{
headerText: "",
key: "Link",
dataType: "string",
unbound: true,
template: "<button class='btn btn-hre viewIncident' data-id='${Id}'>View</button>"

},
{ key: "FirstName", hidden: true },
{ key: "LastName", hidden: true }
//{ key: "FromDate", hidden: true },
//{ key: "ToDate", hidden: true }
],
features: [
{
name: 'Sorting',
type: "local",
mode: "single",
sortUrlKey: "sort"

},
{
name: 'GroupBy',
type: "local",
persist: false,
groupedColumnsChanged: function (evt, ui) {
if (ui.groupedColumns.length > 0) {
$('#collapseAll').show();
if(ui.groupedColumns.length==1){
$("#expandAll").val("Expand All " + ui.groupedColumns[0].col.headerText);
$("#collapseAll").val("Collapse All " + ui.groupedColumns[0].col.headerText);
}else{
$("#expandAll").val("Expand All");
$("#collapseAll").val("Collapse All");
}
} else {
$('#collapseAll').hide();
$('#expandAll').hide();

}
}

},
{
name: 'Filtering',
mode: "advanced",
type: "local",
filterExprUrlKey: "filter",
filterDialogContainment: "window",
filterDialogFilterDropDownDefaultWidth: 100,
persist: true

},
{
name: 'Selection'
}
,
{
name: "Paging",
type: "local",
pageSize: 20,
recordCountKey: "TotalCount",
pageSizeUrlKey: "pageSize",
pageIndexUrlKey: "pageNumber"
},
{
name: "ColumnMoving",
columnMovingDialogContainment: "window"
}
],
autoGenerateLayouts: false,
columnLayouts: [
{
key: "Notices",
autoGeneratedColumns: false,
showHeader: false,
columns: [
{ key: "Id", hidden: true },
{ key: "Title", hidden: true },
{
headerText: "Notice #",
key: "Link",
dataType: "string",
unbound: true,
template: "<a href='#' class='viewIncident' data-step='0' data-id='${Id}'>Notice of ${Title}</a>"

},
{ key: "RouteStageName" },
{ key: "NoticeDate" }
]
}
]
});
console.timeEnd("time");

Thanks in advance!!

Pankaj Bahukhandi