advertisement

Article:
  Dynamic HTML Tables: Improving Performance
Subject:   innerHTML tuned up
Date:   2003-05-11 23:39:47
From:   anonymous2
In my experience it is the excessive use of the "+=" operator on strings which is using most of the time.
So I suggest to use an array of strings as follows and concatenate at the latest possible moment using the join() method.


var output = new Array();
var i = 0;


output[i++] = "<table id='myTable1'><tbody id='myTbody'>";
for (var j = 0; j < tableData.length; j++) {
output[i++] = "<tr class='tr" + (j%2) + "'>";
output[i++] = "<td class='col0'>" + tableData[j].alpha + "</td>";
output[i++] = "<td class='col1'>" + tableData[j].beta + "</td>";
output[i++] = "<td class='col2'>" + tableData[j].gamma + "</td>";
output[i++] = "<td class='col3'>" + tableData[j].delta + "</td>";
output[i++] = "<td class='col4'>" + tableData[j].epsilon + "</td></tr>";
}
output[i++] = "</tbody></table>";
document.getElementById("tableWrap").innerHTML = output.join("");


Try it,
Hubert


hubert.kauker@web.de