Fastest method to escape HTML tags as HTML entities?

html, javascript, performance, regex, string

Solution

You could try passing a callback function to perform the replacement:

var tagsToReplace = {
    '&': '&',
    '<': '&lt;',
    '>': '&gt;'
};

function replaceTag(tag) {
    return tagsToReplace[tag] || tag;
}

function safe_tags_replace(str) {
    return str.replace(/[&<>]/g, replaceTag);
}

Here is a performance test: http://jsperf.com/encode-html-entities to compare with calling the `replace` function repeatedly, and using the DOM method proposed by Dmitrij.

Your way seems to be faster...

Why do you need it, though?

Problem

I'm writing a Chrome extension that involves doing a lot of the following job: sanitizing strings that might contain HTML tags, by converting `<`, `>` and `&` to `&lt;`, `&gt;` and `&amp;`, respectively. (In other words, the same as PHP's `htmlspecialchars(str, ENT_NOQUOTES)` – I don't think there's any real need to convert double-quote characters.) This is the fastest function I have found so far: ``` function safe_tags(str) { return str.replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;') ; } ``` But there's still a big lag when I have to run a few thousand strings through it in one go. Can anyone improve on this? It's mostly for strings between 10 and 150 characters, if that makes a difference. (One idea I had was not to bother encoding the greater-than sign – would there be any real danger with that?)

Original source

Related problems