Build Table (v7)

Revision 7 of this benchmark created on


Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<table id="table">
<tbody>
</tbody>
</table>

Setup

var tbjQuery = $("#table > tbody");
    var tbNative = tbjQuery[0];
    
    var exObj = {
      propA: "A",
      propB: "B"
    };

Test runner

Ready to run.

Testing in
TestOps/sec
Create Element
var subElemTr = document.createElement("tr"),
  subElemTd = document.createElement("td"),
  subElemTdText = document.createTextNode(exObj.propB);

subElemTd.appendChild(subElemTdText);
subElemTr.appendChild(subElemTd);

tbNative.appendChild(subElemTr);
ready
Concatiation
tbNative.innerHtml += "<tr><td>" + exObj.propB + "</td></tr>";
ready
Array join
var buffer = [];
var bufferIndex = -1;

buffer[++bufferIndex] = "<tr><td>";
buffer[++bufferIndex] = exObj.propB;
buffer[++bufferIndex] = "</td></tr>";

tbNative.innerHtml += buffer.join('');
ready
Create Element Document Fragment
var fragment = document.createDocumentFragment(),
  subElemTr = document.createElement("tr"),
  subElemTd = document.createElement("td"),
  subElemTdText = document.createTextNode(exObj.propB);

subElemTd.appendChild(subElemTdText);
subElemTr.appendChild(subElemTd);

fragment.appendChild(subElemTr);


tbNative.appendChild(fragment);
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.