- 1,000 views(100 column)
- 10,000 views(100 column)
- 10,000 views(500 column)
- 1,000,000 views(7 column)
- Wdt webgrid binding speed is related to count of data rows, count of data column.
- Wdt webgrid binding speed is related to ablilty of user computor.
* At this sample, although reaction rate of wdt grid is fast, it takes a long time to make big data of json.
var column = [];
for (var i = 0; i < 100; i++) {
var item = {};
item.id = 'id' + i.toString();
item.name = 'colName' + i.toString();
item.type = 'text';
item.width = '100';
item.align = 'left';
column.push(item);
}
var option = [];
var count = column.length;
var data = [];
for (var rowIndex = 0; rowIndex < 100; rowIndex++) {
var item = {};
for (var i = 0; i < count; i++) {
var col = column[i];
if (col.type == 'number') item[col.id] = rowIndex;
else item[col.id] = col.name + '-' + rowIndex.toString() + '-' + i.toString();
}
data.push(item);
}
wdtGrid.create('grid1', column, option);
wdtGrid.setData('grid1', data);
$('#btnSearch1').click(function(e){
var data = [];
for (var rowIndex = 0; rowIndex < 100; rowIndex++) {
var item = {};
for (var i = 0; i < count; i++) {
var col = column[i];
if (col.type == 'number') item[col.id] = rowIndex;
else item[col.id] = col.name + '-' + rowIndex.toString() + '-' + i.toString();
}
data.push(item);
}
wdtGrid.setData('grid1', data);
wdtGrid.selectRange('grid1', 0, 0);
});
$('#btnSearch2').click(function(e){
var data = [];
for (var rowIndex = 0; rowIndex < 1000; rowIndex++) {
var item = {};
for (var i = 0; i < count; i++) {
var col = column[i];
if (col.type == 'number') item[col.id] = rowIndex;
else item[col.id] = col.name + '-' + rowIndex.toString() + '-' + i.toString();
}
data.push(item);
}
wdtGrid.create('grid1', column, option);
wdtGrid.setData('grid1', data);
wdtGrid.selectRange('grid1', 0, 0);
});
$('#btnSearch3').click(function(e){
var data = [];
for (var rowIndex = 0; rowIndex < 10000; rowIndex++) {
var item = {};
for (var i = 0; i < count; i++) {
var col = column[i];
if (col.type == 'number') item[col.id] = rowIndex;
else item[col.id] = col.name + '-' + rowIndex.toString() + '-' + i.toString();
}
data.push(item);
}
wdtGrid.create('grid1', column, option);
wdtGrid.setData('grid1', data);
wdtGrid.selectRange('grid1', 0, 0);
});
$('#btnSearch4').click(function(e){
var column2 = [
{ id: "text1", name: "text1", type: "text", width: "100", align: 'left' },
{ id: "text2", name: "text2", type: "text", width: "100", align: 'left' },
{ id: "text3", name: "text3", type: "text", width: "100", align: 'left' },
{ id: "text4", name: "text4", type: "text" , width: "100", align: 'left' },
{ id: "text5", name: "text5", type: "text" , width: "100", align: 'left' },
{ id: "text6", name: "text6", type: "text" , width: "100", align: 'left' },
{ id: "text7", name: "text7", type: "text" , width: "100", align: 'left' }
];
var data = [];
for (var rowIndex = 0; rowIndex < 1000000; rowIndex++) {
var item = {};
for (var i = 0, len = column2.length; i < len; i++) {
var col = column2[i];
if (col.type == 'number') item[col.id] = rowIndex;
else item[col.id] = col.name + '-' + rowIndex.toString() + '-' + i.toString();
}
data.push(item);
}
wdtGrid.create('grid1', column2, option);
wdtGrid.setData('grid1', data);
wdtGrid.selectRange('grid1', 0, 0);
});
email : widthart.mail@gmail.com
Copyrightⓒ2022 by wdtgrid.com. All rights reserved.