Run results for: div vs textarea

Run details:

User agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/90.0.4430.212 Safari/537.36

Browser: Chrome 90

Operating system: Windows

Device Platform: Desktop

Date tested: 3 years ago

Test name	Executions per second
innerHTML	1525.5 Ops/sec
innerText	18.2 Ops/sec
textContent	2220.2 Ops/sec
valueA	2123.6 Ops/sec
valueB	995.6 Ops/sec

HTML Preparation code:

<div id='div' style='background:#faebd7;grid-area:console;width:100%;height:76px;resize:none;overflow:auto;font-family:monospace;-webkit-writing-mode:horizontal-tb!important;text-rendering:auto;color:-internal-light-dark(black,#fff);letter-spacing:normal;word-spacing:normal;text-transform:none;text-indent:0;text-shadow:none;display:inline-block;text-align:start;appearance:auto;background-color:-internal-light-dark(#fff,#3b3b3b);flex-direction:column;cursor:text;white-space:pre-wrap;overflow-wrap:break-word;column-count:initial!important;margin:0;font:400 13.3333px monospace;border-width:1px;border-style:solid;border-color:-internal-light-dark(#767676,#858585);border-image:initial;padding:2px'></div>
<textarea id='textarea'  style='background:#faebd7;grid-area:console;width:100%;height:76px;resize:none;overflow:auto;font-family:monospace;-webkit-writing-mode:horizontal-tb!important;text-rendering:auto;color:-internal-light-dark(black,#fff);letter-spacing:normal;word-spacing:normal;text-transform:none;text-indent:0;text-shadow:none;display:inline-block;text-align:start;appearance:auto;background-color:-internal-light-dark(#fff,#3b3b3b);flex-direction:column;cursor:text;white-space:pre-wrap;overflow-wrap:break-word;column-count:initial!important;margin:0;font:400 13.3333px monospace;border-width:1px;border-style:solid;border-color:-internal-light-dark(#767676,#858585);border-image:initial;padding:2px'></textarea>

Script Preparation code:

document.getElementById("div").innerHTML="";
document.getElementById("textarea").value="";

Tests:

innerHTML
document.getElementById("div").innerHTML+="abcdefghijk";
innerText
document.getElementById("div").innerText+="abcdefghijk";
textContent
document.getElementById("div").textContent+="abcdefghijk";
valueA
document.getElementById("textarea").value+="abcdefghijk";
valueB
document.getElementById("textarea").value+="abcdefghijk";

Run results for: div vs textarea

innerHTML

innerText

textContent

valueA

valueB