HTML Encode Methods (v73)

Revision 73 of this benchmark created on

Description

insertAdjacentHTML is surprisingly

Preparation HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

Setup

var html = document.body.innerHTML;
    var map = {
      "&": "&amp;",
      "'": "&#39;",
      '"': "&quot;",
      "<": "&lt;",
      ">": "&gt;"
    };
    var tempElement = $(document.createElement("div"));

Test runner

Ready to run.

Testing in
TestOps/sec
.innerHTML
return document.createElement( 'div' ).appendChild( document.createTextNode( html ) ).parentNode.innerHTML;
 
ready
jQuery .html()
return $('<div/>').text(html).html();
ready
.replace()
return html.replace(/&/g, '&amp;')
    .replace(/"/g, '&quot;')
    .replace(/'/g, '&#39;')
    .replace(/</g, '&lt;')
    .replace(/>/g, '&gt;');
ready
.insertAdjacentHTML
var tempA = document.createElement('div');
tempA.insertAdjacentHTML('afterbegin', html);
return tempA.innerHTML;
ready
.innerHTML directly
var tempA = document.createElement('a');
tempA.innerHTML = html;
return tempA.innerHTML;
ready

Revisions

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