[HOLD for payment 2024-04-09] [$500] [Performance] Reduce the amount of expensive getOptions calls in Request Money flow

[mountiny]

Problem

When using Request Money flow, the getOptions function is called multiple times, doing heavy operations and slowing down the app. Based on a provided trace, a single execution of this function takes ~2.5s, and it is called when the following actions are performed:

• entering the Request Money participants list
• typing in the search input (each keystroke)
• pressing the option from the list
• pressing “split” on the option item

Additionally, the server search to get reports is also called on each keystroke.

All of this is making the app unresponsive for a long time, making it difficult to reach the next step of the money request process. The total amount of getOptions execution time in a provided trace was 29.7s.

Solution

To address this problem, we should reduce the amount of getOptions calls to minimum. We can achieve this by:

• using debounced state instead of calling the function on each keystroke - this way we call getOptions and server search only when user is not typing in the input anymore
• properly memoizing the participants selector component - selecting the user from the list is updating the transaction, which triggers the heavy operation even if the participants list hasn’t changed

There is still need of calling the function when pressing “Split”, but there is a possibility we would be able to replace it with filtering once it’s implemented in the list (this is one of the efforts from the performance audit).
Considering the following scenario:

1. User requests money and goes to participants list
2. User types “workspace” in the search
3. User presses the selected option item

Before changes the getOptions was called 16 times, and after it is called 2 times.

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~019e025ca125dedd18
• Upwork Job ID: 1773283266133659648
• Last Price Increase: 2024-03-28

Issue Owner

Current Issue Owner: @slafortune

[melvin-bot]

Triggered auto assignment to @slafortune (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details.

[TMisiukiewicz]

Hey, I'm Tomasz from Callstack and I want to work on this issue

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~019e025ca125dedd18

[melvin-bot]

Current assignee @akinwale is eligible for the External assigner, not assigning anyone new.

[melvin-bot]

Reviewing label has been removed, please complete the "BugZero Checklist".

[melvin-bot]

The solution for this issue has been 🚀 deployed to production 🚀 in version 1.4.58-8 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

• perf: Reduce heavy operations in Request Money flow #39063

If no regressions arise, payment will be issued on 2024-04-09. 🎊

For reference, here are some details about the assignees on this issue:

• @akinwale requires payment (Needs manual offer from BZ)
• @TMisiukiewicz does not require payment (Contractor)

[melvin-bot]

BugZero Checklist: The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed:

• [@akinwale] The PR that introduced the bug has been identified. Link to the PR:
• [@akinwale] The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake. Link to comment:
• [@akinwale] A discussion in #expensify-bugs has been started about whether any other steps should be taken (e.g. updating the PR review checklist) in order to catch this type of bug sooner. Link to discussion:
• [@akinwale] Determine if we should create a regression test for this bug.
• [@akinwale] If we decide to create a regression test for the bug, please propose the regression test steps to ensure the same bug will not reach production again.
• [@slafortune] Link the GH issue for creating/updating the regression test once above steps have been agreed upon:

[mountiny]

$500 to @akinwale

[slafortune]

@mountiny @akinwale I believe that no regression test will be needed for this, can you confirm?

[mountiny]

No regression tests required here

[melvin-bot]

Payment Summary

Upwork Job

• ROLE: @akinwale paid $(AMOUNT) via Upwork (LINK)
• Contributor: @TMisiukiewicz is from an agency-contributor and not due payment

BugZero Checklist (@slafortune)

• I have verified the correct assignees and roles are listed above and updated the neccesary manual offers
• I have verified that there are no duplicate or incorrect contracts on Upwork for this job (https://www.upwork.com/ab/applicants/1773283266133659648/hired)
• I have paid out the Upwork contracts or cancelled the ones that are incorrect
• I have verified the payment summary above is correct

[slafortune]

@akinwale please the offer sent here $500
@TMisiukiewicz is from an agency-contributor and not due payment

[akinwale]

@slafortune Accepted. Thanks!