Dariusz biela/perf/search refs auto research 3#332
Draft
dariusz-biela wants to merge 135 commits into
Draft
Conversation
Add react-reference-tracker babel plugin and provider to analyze reference stability in Search, SearchList, TransactionListItem, and TransactionItemRow components.
Add replaceEqualDeep structural sharing utility (TanStack Query port), useStableValue hook, install immer and @playwright/test for automated reference tracking pipeline.
Add __benchmarkEditDescription window utility for measuring the full production code path of editing an expense description. Fix local package path for react-reference-tracker.
…l via useStableValue
… via useStableValue
…via useStableValue
…h via useStableValue
…h via useStableValue" This reverts commit b13fc4b.
…a useStableValue" This reverts commit 94b5893.
…Input via useStableValue
…t via useStableValue
…tton via useStableValue
…ateButton via useStableValue
…on via useStableValue
…tProvider via useCallback
…e useState setters to deps
…d ref-during-render
…t-disable and setState-in-effect
Implements the "Latest Ref Pattern" — returns a wrapper with a fixed reference that always delegates to the most recent callback at call-time. The ref is updated in useLayoutEffect (not during render) for Concurrent Mode safety.
…Callback Wraps updateSelectAllMatchingItemsState, toggleTransaction, onSelectRow, fetchMoreResults, toggleAllTransactions, and onLayout with useStableCallback to break the callback cascade through SearchList → BaseSearchList → TransactionListItem → TransactionItemRow.
…StableCallback Also fixes useStableCallback type signature to use explicit TArgs/TReturn generics instead of any constraint, eliminating leaked any types.
…event infinite loop
…geHeaderInput via useStableCallback
dariusz-biela
commented
Apr 13, 2026
Comment on lines
-56
to
+57
| ...(!hasKeyBeenPressed.current && {setHasKeyBeenPressed}), | ||
| setHasKeyBeenPressed, |
Author
There was a problem hiding this comment.
This change is strange; you have to be careful with it.
dariusz-biela
commented
Apr 13, 2026
Comment on lines
260
to
+272
| // Safety timeout: if the optimistic lifecycle hasn't resolved within 10s | ||
| // (e.g. API failure, offline, item never reaches sortedData), clear the | ||
| // skeleton placeholder so the UI doesn't get stuck. The stableSortedData | ||
| // cache (cachedOptimisticItemRef) is intentionally kept alive so the item | ||
| // stays visible at its sorted position until server-confirmed data arrives; | ||
| // clearOptimisticTracking handles that cleanup when pendingAction !== ADD. | ||
| useEffect(() => { | ||
| if (!hasPendingWriteOnMountRef.current) { | ||
| if (!hasPendingWriteOnMount || !optimisticWatchKeyRef.current) { | ||
| return; | ||
| } | ||
| const id = setTimeout(() => setShowPendingExpensePlaceholder(false), OPTIMISTIC_TRACKING_TIMEOUT_MS); | ||
| return () => clearTimeout(id); | ||
| }, []); | ||
| }, [hasPendingWriteOnMount]); |
Author
There was a problem hiding this comment.
This change is strange; you have to be careful with it.
dariusz-biela
commented
Apr 13, 2026
Comment on lines
350
to
+365
| const isSearchResultsEmptyRef = useRef(isSearchResultsEmpty); | ||
| isSearchResultsEmptyRef.current = isSearchResultsEmpty; | ||
| useEffect(() => { | ||
| isSearchResultsEmptyRef.current = isSearchResultsEmpty; | ||
| }, [isSearchResultsEmpty]); |
Author
There was a problem hiding this comment.
This change is strange; you have to be careful with it.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Explanation of Change
Fixed Issues
$
PROPOSAL:
Tests
Offline tests
QA Steps
// TODO: These must be filled out, or the issue title must include "[No QA]."
PR Author Checklist
### Fixed Issuessection aboveTestssectionOffline stepssectionQA stepssectiontoggleReportand notonIconClick)src/languages/*files and using the translation methodSTYLE.md) were followedAvatar, I verified the components usingAvatarare working as expected)StyleUtils.getBackgroundAndBorderStyle(theme.componentBG))npm run compress-svg)Avataris modified, I verified thatAvataris working as expected in all cases)Designlabel and/or tagged@Expensify/designso the design team can review the changes.ScrollViewcomponent to make it scrollable when more elements are added to the page.mainbranch was merged into this PR after a review, I tested again and verified the outcome was still expected according to theTeststeps.Screenshots/Videos
Android: Native
Android: mWeb Chrome
iOS: Native
iOS: mWeb Safari
MacOS: Chrome / Safari