Skip to content

[Do Not Merge] perf: batch cold-cache pre-warm in mergeCollectionWithPatches via multiGet#91585

Draft
elirangoshen wants to merge 3 commits into
Expensify:mainfrom
callstack-internal:elirangoshen/perf/mergeCollection-multiGet-prewarm
Draft

[Do Not Merge] perf: batch cold-cache pre-warm in mergeCollectionWithPatches via multiGet#91585
elirangoshen wants to merge 3 commits into
Expensify:mainfrom
callstack-internal:elirangoshen/perf/mergeCollection-multiGet-prewarm

Conversation

@elirangoshen
Copy link
Copy Markdown
Contributor

@elirangoshen elirangoshen commented May 25, 2026

Explanation of Change

Companion App PR for callstack-internal/react-native-onyx#5.

Two changes:

  1. Repoint react-native-onyx pin to callstack-internal/react-native-onyx#c1be5731. The onyx-side change introduces a hybrid pre-warm strategy for mergeCollectionWithPatches:

    • Fast path (every existing key already warm in cache): use Promise.resolve() to preserve the original promise-chain depth and subscriber-callback timing.
    • Slow path (at least one cache miss): use multiGet to batch the missing keys into one Storage.multiGet round-trip instead of N parallel get() calls.

    See the onyx PR for the full motivation, code, and 5 automated regression tests.

  2. Add OnyxUpdates.applyHTTPSOnyxUpdates Sentry span. Measures the time mergeCollectionWithPatches actually saves on real workloads (LHN refresh, OpenApp response, Pusher updates, search refreshes). Lets us A/B the bundled pin against main in staging.

Fixed Issues

$ #90634
PROPOSAL: N/A (performance improvement, not a proposal-driven issue)

Automated Tests

Tests

End-to-end verification on web. The onyx PR's Manual Tests section has the full step-by-step (DevTools storage-counter instrumentation, IDB-delete simulation, etc.); the summary below is what to actually run against this App pin.

Setup

  1. Check out elirangoshen/perf/mergeCollection-multiGet-prewarm (this branch).
  2. npm install under Node 20.20.0, npm run web.
  3. Open https://dev.new.expensify.com:8082/ in Chrome with DevTools open, sign in.

Slow path — cold-cache batched read (core perf claim)

  1. Application → IndexedDB → delete OnyxDB while running (do not reload).
  2. Trigger an Onyx.update containing a MERGE_COLLECTION op — open Search RHP, switch workspaces, or wait for a Pusher reportActions_ update.
  3. Expected: exactly one batched Storage.multiGet covering the missing keys; zero individual Storage.getItem calls during pre-warm. On main you'd see N parallel getItem calls instead.

Fast path — warm-cache no-op

  1. After the step above, the cache is warm. Trigger the same MERGE_COLLECTION flow.
  2. Expected: zero multiGet, zero getItem calls during pre-warm. Subscriber receives a single merged broadcast with no transient undefined/empty render flicker.

Functional smoke (no regression in mergeCollection-driven flows)

  1. Initial hydration after login — LHN populates.
  2. Send a chat message — appears immediately, persists after reload.
  3. Mark-all-as-read — badges clear, stay cleared.
  4. Search filter — results populate live.
  5. Hold/unhold an expense — badge toggles, persists.
  6. Submit expense via FAB — appears immediately in the report, persists.
  7. Switch workspaces — LHN filters correctly.

Cold-cache merge correctness

  1. Sign in, write collection data, reload (clears cache, keeps storage).
  2. Trigger a MERGE_COLLECTION against one of those keys before the LHN hydrates it.
  3. Expected: merged value retains all fields from storage; the delta is layered on top — no silent drops.

Sentry span verification

  1. With Sentry attached (check [Sentry][...] Ending span console logs), trigger a couple of Onyx.update flows.
  2. Expected: OnyxUpdates.applyHTTPSOnyxUpdates spans appear with durationMs populated, ready for A/B comparison against main in staging.
  • Verify that no errors appear in the JS console

Offline tests

Storage-failure regression (carry-over from #91160 / onyx #787)

  1. With App running and authenticated, Application → IndexedDB → right-click → delete OnyxDB. Do not reload.
  2. Immediately trigger a MERGE_COLLECTION action.
  3. Expected: UI updates correctly; new state is visible to subscribers even though IDB writes fail. Console shows storage errors, but no white screen / no stale UI / no data loss within the session.

Standard offline path: toggle the network off, send a chat message, mark-all-as-read, switch workspaces — verify optimistic updates render immediately and reconcile correctly when the network is restored.

QA Steps

Same as Tests. Run the Functional smoke block on each platform to confirm no regression in mergeCollection-driven flows (LHN hydration, chat send, mark-all-as-read, search filter, hold/unhold, FAB submit, workspace switch).

  • Verify that no errors appear in the JS console

PR Author Checklist

  • I linked the correct issue in the ### Fixed Issues section above
  • I wrote clear testing steps that cover the changes made in this PR
    • I added steps for local testing in the Tests section
    • I added steps for the expected offline behavior in the Offline steps section
    • I added steps for Staging and/or Production testing in the QA steps section
    • I added steps to cover failure scenarios (i.e. verify an input displays the correct error message if the entered data is not correct)
    • I turned off my network connection and tested it while offline to ensure it matches the expected behavior (i.e. verify the default avatar icon is displayed if app is offline)
    • I tested this PR with a High Traffic account against the staging or production API to ensure there are no regressions (e.g. long loading states that impact usability).
  • I included screenshots or videos for tests on all platforms
  • I ran the tests on all platforms & verified they passed on:
    • Android: Native
    • Android: mWeb Chrome
    • iOS: Native
    • iOS: mWeb Safari
    • MacOS: Chrome / Safari
  • I verified there are no console errors (if there's a console error not related to the PR, report it or open an issue for it to be fixed)
  • I followed proper code patterns (see Reviewing the code)
    • I verified that any callback methods that were added or modified are named for what the method does and never what callback they handle (i.e. toggleReport and not onIconClick)
    • I verified that comments were added to code that is not self explanatory
    • I verified that any new or modified comments were clear, correct English, and explained "why" the code was doing something instead of only explaining "what" the code was doing.
    • I verified any copy / text shown in the product is localized by adding it to src/languages/* files and using the translation method
    • I verified all numbers, amounts, dates and phone numbers shown in the product are using the localization methods
    • I verified any copy / text that was added to the app is grammatically correct in English. It adheres to proper capitalization guidelines (note: only the first word of header/labels should be capitalized), and is either coming verbatim from figma or has been approved by marketing (in order to get marketing approval, ask the Bug Zero team member to add the Waiting for copy label to the issue)
    • I verified proper file naming conventions were followed for any new files or renamed files. All non-platform specific files are named after what they export and are not named "index.js". All platform-specific files are named for the platform the code supports as outlined in the README.
    • I verified the JSDocs style guidelines (in STYLE.md) were followed
  • If a new code pattern is added I verified it was agreed to be used by multiple Expensify engineers
  • I followed the guidelines as stated in the Review Guidelines
  • I tested other components that can be impacted by my changes (i.e. if the PR modifies a shared library or component like Avatar, I verified the components using Avatar are working as expected)
  • I verified all code is DRY (the PR doesn't include any logic written more than once, with the exception of tests)
  • I verified any variables that can be defined as constants (ie. in CONST.ts or at the top of the file that uses the constant) are defined as such
  • I verified that if a function's arguments changed that all usages have also been updated correctly
  • If any new file was added I verified that:
    • The file has a description of what it does and/or why is needed at the top of the file if the code is not self explanatory
  • If a new CSS style is added I verified that:
    • A similar style doesn't already exist
    • The style can't be created with an existing StyleUtils function (i.e. StyleUtils.getBackgroundAndBorderStyle(theme.componentBG))
  • If new assets were added or existing ones were modified, I verified that:
    • The assets are optimized and compressed (for SVG files, run npm run compress-svg)
    • The assets load correctly across all supported platforms.
  • If the PR modifies code that runs when editing or sending messages, I tested and verified there is no unexpected behavior for all supported markdown - URLs, single line code, code blocks, quotes, headings, bold, strikethrough, and italic.
  • If the PR modifies a generic component, I tested and verified that those changes do not break usages of that component in the rest of the App (i.e. if a shared library or component like Avatar is modified, I verified that Avatar is working as expected in all cases)
  • If the PR modifies a component related to any of the existing Storybook stories, I tested and verified all stories for that component are still working as expected.
  • If the PR modifies a component or page that can be accessed by a direct deeplink, I verified that the code functions as expected when the deeplink is used - from a logged in and logged out account.
  • If the PR modifies the UI (e.g. new buttons, new UI components, changing the padding/spacing/sizing, moving components, etc) or modifies the form input styles:
    • I verified that all the inputs inside a form are aligned with each other.
    • I added Design label and/or tagged @Expensify/design so the design team can review the changes.
  • If a new page is added, I verified it's using the ScrollView component to make it scrollable when more elements are added to the page.
  • I added unit tests for any new feature or bug fix in this PR to help automatically prevent regressions in this user flow.
  • If the main branch was merged into this PR after a review, I tested again and verified the outcome was still expected according to the Test steps.

Screenshots/Videos

Android: Native
Android: mWeb Chrome
iOS: Native
iOS: mWeb Safari
MacOS: Chrome / Safari

elirangoshen and others added 3 commits May 21, 2026 14:45
Bumps react-native-onyx to elirangoshen/perf/mergeCollection-multiGet-prewarm
HEAD (731fe957), which stacks on top of Expensify#787 (cache-first
mergeCollectionWithPatches) and adds a cold-cache pre-warm optimization:

- Fast path (every existingKey is in cache): skip pre-warm entirely.
  Preserves the original promise-chain depth so subscriber-callback
  timing is unchanged for warm-cache merges (the common case).

- Slow path (any existingKey is a cache miss): use Storage.multiGet
  to batch the missing keys into a single storage round-trip, instead
  of N parallel Storage.getItem calls.

Net runtime effect: same correctness, fewer storage operations on
cold-cache merges, same broadcast timing for warm-cache merges.

This branch also drops the now-obsolete `react-native-onyx+3.0.73.patch`
(the canonical upstream revert it implemented landed in Onyx PR Expensify#785,
which is already part of the pinned SHA).

Not for merge -- branch is for performance verification only.
Wraps applyHTTPSOnyxUpdates in a Sentry span via the existing
@libs/telemetry/activeSpans helper so we can measure local
Onyx-update processing time per API response, isolated from network
latency. Cold-cache mergeCollection batches dominate this duration
during OpenApp / ReconnectApp / Search, so this span is a clean
A/B-test signal for mergeCollectionWithPatches changes (cache-first
ordering and multiGet pre-warm).

Span attributes: command, onyx_data_count, success_data_count,
failure_data_count. Local console output via the helper:
[Sentry][OnyxUpdates.applyHTTPSOnyxUpdates:OpenApp:<id>] Ending span (Xms)

Not for merge -- perf-test instrumentation only.
…ions

Updates the package.json pin from Expensify/react-native-onyx#731fe957
to callstack-internal/react-native-onyx#c1be5731. The new SHA brings in
the 5 mergeCollection pre-warm regression tests added on top of the
original perf change, so the bundled build matches the test names
referenced in PR #5's Manual Tests section.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
@github-actions
Copy link
Copy Markdown
Contributor

⚠️ This PR is possibly changing native code and/or updating libraries, it may cause problems with HybridApp. Please check if any patch updates are required in the HybridApp repo and run an AdHoc build to verify that HybridApp will not break. Ask Contributor Plus for help if you are not sure how to handle this. ⚠️

@fabioh8010
Copy link
Copy Markdown
Contributor

@elirangoshen

  • Please remove [No QA] label as QA must test this
  • Please use the correct PR body
  • Attach videos/screenshots

@elirangoshen
Copy link
Copy Markdown
Contributor Author

elirangoshen commented May 27, 2026

@elirangoshen

  • Please remove [No QA] label as QA must test this
  • Please use the correct PR body
  • Attach videos/screenshots

Hi there has been misunderstood, this it not pr to open, as its only for testing the other onyx change, so this is only companion pr, thats why I left it as draft :) Ill modify the pr body , screenshots are in the onyx pr

@elirangoshen elirangoshen changed the title perf: batch cold-cache pre-warm in mergeCollectionWithPatches via multiGet [No QA] [Do Not Merge] perf: batch cold-cache pre-warm in mergeCollectionWithPatches via multiGet May 27, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants