Run results for: Escape HTML string tags in JavaScript

Run details:

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/137.0.0.0 Safari/537.36

Browser: Chrome 137

Operating system: Mac OS X 10.15.7

Device Platform: Desktop

Date tested: one year ago

escapeHtmlByReplacingCharacters

1.4M/s

escapeHtml

1.1M/s

View exact numbers

Test name	Executions per second
✓ escapeHtmlByReplacingCharacters	1,402,227 Ops/sec
escapeHtml	1,120,623 Ops/sec

HTML Preparation code:

<!--your preparation HTML code goes here-->

Script Preparation code:

function escapeHtmlByReplacingCharacters(str) {
  if (typeof str !== 'string') {
    return '';
  }

  const escapeCharacter = (match) => {
    switch (match) {
      case '&': return '&amp;';
      case '<': return '&lt;';
      case '>': return '&gt;';
      case '"': return '&quot;';
      case '\'': return '&#039;';
      case '`': return '&#096;';
      default: return match;
    }
  };

  return str.replace(/[&<>"'`]/g, escapeCharacter);
}

function escapeHtml(strings, ...arguments) {
  const div = document.createElement('div');
  let output = strings[0];
  const args = arguments.entries();

  for (const [i, arg] of args) {
    div.innerText = arg;

    output += div.innerHTML;
    output += strings[i + 1];
  }

  return output;
}

Tests:

escapeHtmlByReplacingCharacters
const testString = "Hello, <b>world</b>! & 'this' is a \"test\" string with `backticks`."; escapeHtmlByReplacingCharacters(testString);
escapeHtml
const testString = "Hello, <b>world</b>! & 'this' is a \"test\" string with `backticks`."; escapeHtml`${testString}`

Run results for: Escape HTML string tags in JavaScript

Escape HTML string tags in JavaScript by Character replacement vs. Tagged template literal function

escapeHtmlByReplacingCharacters

escapeHtml