dom-methods vs innerHTML
JavaScript performance comparison
Preparation code
<script>
Benchmark.prototype.setup = function() {
function dom(){
var table, row, data;
table = document.createElement('table');
table.border = 1;
for (var k = 0; k < 4; k++) {
row = document.createElement('tr');
for (var m = 0; m < 5; m++) {
data = document.createElement('td');
data.textContent = "строка " +k+"; яч "+m;
row.appendChild(data);
}
table.appendChild(row);
}
}
function html(){
var strTabl="", table;
for (k = 0; k < 4; k++) {
strTabl+= "<tr>";
for (m = 0; m < 5; m++) {
strTabl+= "<td>"+"строка " +k+"; яч "+m+"</td>";
} strTabl+= "</tr>";
}
table = document.createElement('table');
table.innerHTML = strTabl;
}
};
</script>
Test runner
Warning! For accurate results, please disable Firebug before running the tests. (Why?)
Java applet disabled.
| Test | Ops/sec | |
|---|---|---|
Create Table using DOM methods |
|
pending… |
Create Table using innerHTML |
|
pending… |
Compare results of other browsers
Revisions
You can edit these tests or add even more tests to this page by appending /edit to the URL. Here’s a list of current revisions for this page:
- Revision 1: published by danik
- Revision 2: published by danik
0 comments