The fastest way to retrieve recursively all text nodes containing a substring

The best approach to get all child text nodes of an HTML element

Marian C.
4 min readAug 29, 2024

Text nodes are necessary for highlighting keywords without modifications in the web page DOM. If the page contents are gradually loaded and removes as the web page is scrolled, then the set of the detected text nodes needs to be continuously updated and, thus, the search for text nodes needs to be fast.

In this post I assess performance of possible approaches to retrieve all child text nodes of an HTML element or all text nodes in the DOM. There are several options:

  • recursion using childNodes
  • TreeWalker
  • NodeIterator
  • document.evaluate() with text() XPath function

During benchmarking, text nodes are identified in a sample HTML document that I created by combining HTML code of several popular websites. I reuse the code from a post about retrieval of elements.

The fastest approach to retrieve all child text nodes inside an element

I evaluate the performance of possible childNodes-based approaches in three functions a(), b() and c(). The code of the functions e()

--

--

Marian C.
Marian C.

Written by Marian C.

Java, JavaScript and SQL developer. Interested in data collection and visualization.

Responses (11)