Web Inspector: Search tab should lazily insert/remove its navigation sidebar tree items during scrolling

[patrickangle]

0ccc6a9

Web Inspector: Search tab should lazily insert/remove its navigation sidebar tree items during scrolling
https://bugs.webkit.org/show_bug.cgi?id=242419
rdar://problem/96601304

Reviewed by Devin Rousso.

Improve performance of the Search tab by virtualizing the navigation tree outline, which allows us to reduce the number
of DOM elements that are attached to the DOM at any given point.

This accounts for about 50% of the performance improvements that have taken searching for the letter `a` on webkit.org
from ~13 seconds to under a second (using manual stopwatch testing across 5 tests before and after). The other 50% of
the improvement is from bug 242450 (Web Inspector: Lazily create SourceCodeTextRange for search result objects). Note
that very large sites still pose a problem, but instrumenting search performance has been tricky because they lock up
and never return performance/timing data.

* Source/WebInspectorUI/UserInterface/Views/SearchSidebarPanel.js:
(WI.SearchSidebarPanel):

Canonical link: https://commits.webkit.org/252279@main

[dcrousso]

Can you elaborate more what you mean by

Note that currently we only virtualize the top-level items (in this case a resource).

I'm pretty sure WI.TreeOutline.prototype.registerScrollVirtualizer knows how to handle nested WI.TreeElement 🤔

[dcrousso]

Are we completely sure that every tree item will have exactly 20px height? This entire system only works if that is the case 😅

Style: const treeItemHeight = 20;

[webkit-commit-queue]

Committed 252279@main (0ccc6a9): https://commits.webkit.org/252279@main

Reviewed commits have been landed. Closing PR #2175 and removing active labels.