Improve hideIfContainsVisibleText performance
This is how hideIfContainsVisibleText performs on an Intel Core i7-8565U CPU with 16GB of RAM (latest Laptop hardware)
There are various ways we can improve performance, but the easiest win seems to be a WeakSet that flags already traversed nodes
let ws = new WeakSet();
hideIfMatches(
(element, closest) => {
if (ws.has(element))
return false;
ws.add(element);
return re.test(getVisibleContent(element, closest));
},
selector, searchSelector);
The getVisibleContent is indeed a very expensive operation, and we skip only nodes that have been marked as insivible, but we keep searching over and over the same nodes we previously parsed, because we query the entire document every time the MutationObserver triggers records.
Using just that variation, the performance would notably increase already, avoiding all 100% CPU spikes.
Outstanding Concerns
If we are worried that an element already flagged could have changed text underneath, then we need to rethink our MutationObserver callback logic, by traversing/parsing only added nodes, or those present in the record as .target, and its closest match, when it comes to characterData mutation type.
https://developer.mozilla.org/en-US/docs/Web/API/MutationRecord#Properties
However, I wonder if we have real-world cases where content actually does change underneath, because if we don't I suggest we drop the characterData observation completely, which gives us extra performance boost, and we simply crawl, via querySelectorAll, over added nodes only, to simplify the parsing of infinite scrolling pages.
This is indeed how much degradation we could have using the current document.querySelectorAll invoke per each observed mutation.


