Data Table Firefox Update Speed
Slower than expected speeds to update cells in data tables with 10,000+ rows.
HTML
<link rel="stylesheet" href="https://cdn.datatables.net/v/dt/jq-2.2.4/dt-1.10.15/se-1.2.2/datatables.min.css">
<script src="https://cdn.datatables.net/v/dt/jq-2.2.4/dt-1.10.15/se-1.2.2/datatables.min.js"></script>
<body>
<table id="example" class="display" cellspacing="0" width="100%">
</table>
<button id="doSomething">Do Something</button>
</body>
JavaScript
$(document).ready(function() {
var dataSet = [];
for (var i = 0; i < 1e4; i++) {
dataSet.push({
name: "bob " + i,
position: "job " + i,
office: i
})
}
var table = $('#example').DataTable({
select: true,
data: dataSet,
deferRender: true,
columns: [
{ data: "name", title: "name", name: "name" },
{ data: "position", title: "position", name: "position" },
{ data: "office", title: "office", name: "office" }
]
});
table.rows().select();
$('#doSomething').on( 'click', function () {
var start = new Date();
dataSet.forEach(function(row, index) {
if (index % 2 == 0)
return;
row.office++;
table.cell(index, "office:name").invalidate();
});
var end = new Date();
console.log("Took " + (end-start) + "ms to alter data");
} );
} );