Background
Investigation into the Reports/Search page load times revealed three distinct start types:
| Category |
Description |
Time to Display |
| Cold start |
Data not yet fetched from backend; skeleton screen shown |
~200ms |
| Warm start (first render in session) |
Full page with data loaded immediately |
~550ms |
| Warm start (subsequent renders) |
Tab navigator cache hit |
~30ms |
Root Cause
The ~550ms warm start is caused by two factors:
- We wait for the entire page — including the expenses list — to finish rendering before showing anything to the user.
- Each list row re-renders 6–10 times before becoming visible, due to unstable application state and insufficient reference stabilization that prevents the React Compiler from optimizing those re-renders.
Proposed Solution
Apply NavigationDeferredMount to the Reports/Search page, the warm start (first render) will behave like a cold start:
- Show skeleton after ~200ms
- Render full content ~400ms later
This improves perceived performance even though the final render arrives slightly later in absolute terms.
Issue Owner
Current Issue Owner: @mallenexpensify
Background
Investigation into the Reports/Search page load times revealed three distinct start types:
Root Cause
The ~550ms warm start is caused by two factors:
Proposed Solution
Apply
NavigationDeferredMountto the Reports/Search page, the warm start (first render) will behave like a cold start:This improves perceived performance even though the final render arrives slightly later in absolute terms.
Issue Owner
Current Issue Owner: @mallenexpensify