HTML highlighting-DOMBrew-vs-innerHTML (v2)

Revision 2 of this benchmark created by Gleb Mazovetskiy on October 27, 2011

Description

Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script src="https://raw.github.com/glebm/DOMBrew/master/dombrew.min.js"></script>

<div id="test-text" style="display:none">
"First of all, dear friend, tell me how you are. Set your friend's mind
at rest," said he without altering his tone, beneath the politeness
and affected sympathy of which indifference and even irony could be
discerned.

"Can one be well while suffering morally? Can one be calm in times like
these if one has any feeling?" said Anna Pavlovna. "You are staying the
whole evening, I hope?"

"And the fete at the English ambassador's? Today is Wednesday. I must
put in an appearance there," said the prince. "My daughter is coming for
me to take me there."

"I thought today's fete had been canceled. I confess all these
festivities and fireworks are becoming wearisome."

"If they had known that you wished it, the entertainment would have been
put off," said the prince, who, like a wound-up clock, by force of habit
said things he did not even wish to be believed.

"Don't tease! Well, and what has been decided about Novosiltsev's
dispatch? You know everything."

"What can one say about it?" replied the prince in a cold, listless
tone. "What has been decided? They have decided that Buonaparte has
burnt his boats, and I believe that we are ready to burn ours."

Prince Vasili always spoke languidly, like an actor repeating a stale
part. Anna Pavlovna Scherer on the contrary, despite her forty years,
overflowed with animation and impulsiveness. To be an enthusiast had
become her social vocation and, sometimes even when she did not
feel like it, she became enthusiastic in order not to disappoint the
expectations of those who knew her. The subdued smile which, though it
did not suit her faded features, always played round her lips expressed,
as in a spoiled child, a continual consciousness of her charming defect,
which she neither wished, nor could, nor considered it necessary, to
</div>
<script>
  window.$b = DOMBrew;
  
  $b.highlight = function(keyword, text) {
    var last = 0, matchData, pieces = [], re = new RegExp(keyword, "gi");
    while ((matchData = re.exec(text)) !== null) {
      pieces.push($b('text', text.slice(last, matchData.index)));
      pieces.push($b('em', text.slice(matchData.index, matchData.index + matchData[0].length)));
      last = re.lastIndex;
    }
    pieces.push($b('text', text.slice(last, text.length)));
    return $b(pieces).dom();
  };
  
  $.highlight = function (keyword, text) {
      return text.replace(new RegExp(keyword, 'gi'), function(m){ return "<em>" + m + "</em>"});
  };
</script>

Setup

window.testTextData = $("#test-text").text()
    window.testKeywords = [
    "a", "b", "c", ' ',
    '"', 'ym', 'all', "'"
    ];

Test runner

var $results = $("#results");
for (var i = 0; i < testKeywords.length; i++) {
  $b.highlight(testKeywords[i], testTextData);
};
 

var $results = $("#results");
var d = document.createElement("p");

for (var i = 0; i < testKeywords.length; i++) {
  d.innerHTML = $.highlight(testKeywords[i], testTextData);
};
 

Revisions

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

• Revision 1: published by Gleb Mazovetskiy on July 23, 2011
• Revision 2: published by Gleb Mazovetskiy on October 27, 2011