Branch: refs/heads/main
Home: https://github.com/WebKit/WebKit
Commit: a2e3ab02b806f1bb8532d598b96ff123daaf03f0
https://github.com/WebKit/WebKit/commit/a2e3ab02b806f1bb8532d598b96ff123daaf03f0
Author: Razvan Caliman <[email protected]>
Date: 2026-01-29 (Thu, 29 Jan 2026)
Changed paths:
M Source/WebInspectorUI/UserInterface/Main.html
A
Source/WebInspectorUI/UserInterface/Views/SearchResultsPlaceholderTreeElement.css
A
Source/WebInspectorUI/UserInterface/Views/SearchResultsPlaceholderTreeElement.js
M Source/WebInspectorUI/UserInterface/Views/SearchSidebarPanel.js
M Source/WebInspectorUI/UserInterface/Views/TreeElement.js
Log Message:
-----------
Web Inspector: Performance issue with search tab and single character
rdar://49234522
https://bugs.webkit.org/show_bug.cgi?id=262158
Reviewed by Devin Rousso.
Web Inspector search works by first requesting a list of all resources
that have matches for a query. Then, iterating through each resource,
it gets lines of text where matches are found. Finally the same search
query regex is applied to each line to get individual search result matches.
Before this patch, a `WI.SearchResultTreeElement` was created and attached
for each match, regardless of how many. This was expensive for a few reasons:
- for each result, a few substring operations are run on the line of text
to provide context around the individual match. On minified files,
this means working on almost the entire contents of the file.
- attaching the tree element to the tree outline creates a DOM structure for
each element,
without necessarily attaching it to the DOM (tree outline virtualization
handles that),
adds event handlers, creates relationships with sibling tree elements, etc.
All this work is done regardless if the tree element will ever be seen.
For queries with a very large number of results (tens or hundreds of thousands),
there's a lot unnecessary work done before even showing the first few results.
This work occurs on the UI thread and blocks interaction within Web Inspector.
>From a UX perspective, a user overwhelmed with a large volume of search results
is more likely to want to refine their query than see all of the results.
This patch reduces the amount of work done:
- for each resource, show only the first 100 results by default.
- provide UI controls per resource to load more results or all results.
This allows a user to intentionally request to show a known large number of
results
with the implied acknowledgement that the action might cause a slowdown.
This follows a pattern used elsewhere in Web Inspector: showing contents of
Arrays,
Sets, Maps, or DataGrids with many entries.
- other piecemeal optimizations:
-- event delegation for handling double-click on individual search result tree
elements
* Source/WebInspectorUI/UserInterface/Main.html:
*
Source/WebInspectorUI/UserInterface/Views/SearchResultsPlaceholderTreeElement.css:
Added.
(.tree-outline .item.search-results-placeholder > button):
(&:first-of-type):
*
Source/WebInspectorUI/UserInterface/Views/SearchResultsPlaceholderTreeElement.js:
Added.
(WI.SearchResultsPlaceholderTreeElement):
(WI.SearchResultsPlaceholderTreeElement.prototype.onattach):
(WI.SearchResultsPlaceholderTreeElement.prototype._handleShowMoreButtonClicked):
(WI.SearchResultsPlaceholderTreeElement.prototype._handleShowAllButtonClicked):
* Source/WebInspectorUI/UserInterface/Views/SearchSidebarPanel.js:
(WI.SearchSidebarPanel):
(WI.SearchSidebarPanel.prototype.performSearch):
(WI.SearchSidebarPanel.prototype.attached):
(WI.SearchSidebarPanel.prototype.detached):
(WI.SearchSidebarPanel.prototype.matchTreeElementAgainstCustomFilters):
(WI.SearchSidebarPanel.prototype.searchResultsPlaceholderLoadMoreResults):
(WI.SearchSidebarPanel.prototype._renderResultsForSourceCodeTreeElement):
(WI.SearchSidebarPanel.prototype._createSearchResultsPlaceholderTreeElementIfNeeded):
(WI.SearchSidebarPanel.prototype.performSearch.createTreeElementForMatchObject):
Deleted.
(WI.SearchSidebarPanel.prototype._treeElementDoubleClick): Deleted.
* Source/WebInspectorUI/UserInterface/Views/TreeElement.js:
(WI.TreeElement.prototype._setListItemNodeContent):
(WI.TreeElement.prototype.get titleHTML): Deleted.
(WI.TreeElement.prototype.set titleHTML): Deleted.
Drive-by clean-up of unused `titleHTML`
Canonical link: https://commits.webkit.org/306429@main
To unsubscribe from these emails, change your notification settings at
https://github.com/WebKit/WebKit/settings/notifications
