Benchmark: Move Element to another 2

HTML Preparation code:

<table class="new">
	<tbody>
		<tr class="new-tr">
		</tr>
	</tbody>
</table>

Script Preparation code:

var table_new_tr = document.getElementsByClassName('new-tr')[0];
var createElement = (() => {
    const tempDiv = document.createElement('div');

    return htmlString => {
        tempDiv.innerHTML = htmlString.trim();
        return tempDiv.removeChild(tempDiv.firstChild);
    };
})();

Tests:

innerHTML
table_new_tr.innerHTML = '<div>el</div>';
appendChild
table_new_tr.appendChild(createElement('<div>el</div>'));
insertAdjacentElement
table_new_tr.insertAdjacentElement('beforeend', createElement('<div>el</div>'));
insertAdjacentHTML (remove)
table_new_tr.insertAdjacentHTML('beforeend', '<div>el</div>');

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
innerHTML
appendChild
insertAdjacentElement
insertAdjacentHTML (remove)

Fastest: N/A

Slowest: N/A

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

Related benchmarks:

Move Element to another 2 (version: 0)

Comparing performance of: innerHTML vs appendChild vs insertAdjacentElement vs insertAdjacentHTML (remove)

Created: 5 years ago by: Registered User

Jump to the latest result

innerHTML

appendChild

insertAdjacentElement

insertAdjacentHTML (remove)

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results