Run results for: Move Element to another 2

Run details:

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 11_0_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/87.0.4280.88 Safari/537.36

Browser: Chrome 87

Operating system: Mac OS X 11.0.1

Device Platform: Desktop

Date tested: 3 years ago

Test name	Executions per second
innerHTML	261679.5 Ops/sec
appendChild	203011.5 Ops/sec
insertAdjacentElement	167421.7 Ops/sec
insertAdjacentHTML (remove)	190708.8 Ops/sec

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>');

Run results for: Move Element to another 2

innerHTML

appendChild

insertAdjacentElement

insertAdjacentHTML (remove)