[HOLD for payment 2023-10-02] [HOLD] [Performance] ReportScreen unnecessary re-renders

[mountiny]

If you haven’t already, check out our contributing guidelines for onboarding and email [email protected] to request to join our Slack channel!

---

What performance issue do we need to solve?

Right now, every time a report action updates the whole <ReportActionsList /> will re-render. None of the items that get rendered are memoized. This means that on a single update (e.g. adding a reaction/editing the text) all mounted views of the list will need to re-render.

Lets investigate the ReportScreen component tree too as its quite render heavy

What is the impact of this on end-users?

Re-rendering components when its contents haven't changed will in general slow down the app for no good reason

List any benchmarks that show the severity of the issue

None yet

Proposed solution (if any)

1. Memoize the - For this approach it would be good to have a version number for each report action, so we can quickly compare if we need to re-render it
2. Only pass an array of string ids to , which represents the order of report actions. Then, just receives a string, and connects to onyx to get updates for the action from the store. This way when an update to a report happens (such as an added reaction), only the instance of has to re-render instead of the whole list
   This approach might even be faster than the first option, as on an update not all items have to run their arePropsEqual function.

List any benchmarks after implementing the changes to show impacts of the proposed solution (if any)

None yet

Platforms:

Which of our officially supported platforms is this issue occurring on?

• Android / native
• Android / Chrome
• iOS / native
• iOS / Safari
• MacOS / Chrome / Safari
• MacOS / Desktop

Version Number: v1.2.71-1
Reproducible in staging?: yes
Reproducible in production?: yes
Email or phone of affected tester (no customers): N/A
Logs: https://stackoverflow.com/c/expensify/questions/4856
Notes/Photos/Videos: Any additional supporting documentation
Expensify/Expensify Issue URL: here
Issue reported by: @hannojg
Slack conversation: https://expensify.slack.com/archives/C049HHMV9SM/p1675076963206029

View all open jobs on Upwork

[hannojg]

Please assign me for this one 👼

[MelvinBot]

This issue has not been updated in over 15 days. eroding to Monthly issue.

P.S. Is everyone reading this sure this is really a near-term priority? Be brave: if you disagree, go ahead and close it out. If someone disagrees, they'll reopen it, and if they don't: one less thing to do!

[mountiny]

I think this might one of @hannojg priorities once the Reactions go through some polish

[MelvinBot]

This issue has not been updated in over 15 days. @hannojg eroding to Monthly issue.

P.S. Is everyone reading this sure this is really a near-term priority? Be brave: if you disagree, go ahead and close it out. If someone disagrees, they'll reopen it, and if they don't: one less thing to do!

[mountiny]

@hannojg How is this looking with your other projects? Reactions are almost done

[mountiny]

bumping this to Daily to make sure we investigate this as we are making this component even more robust with manual request so achieving great performance is important

[hannojg]

@mountiny I will pass this task on to @janicduplessis , while I will investigate the performance of other flows in the app.
Please assign him, the issue is in good hands with him 😊

@janicduplessis Despite the title of the issue the goal here is to make the ReportScreen work just fast.

[mountiny]

@janicduplessis Can you please comment on this issue so I can assign you? thank you!

[janicduplessis]

Sounds good!

[janicduplessis]

Updated #19345 to only include virtualized list batch size change.

[mountiny]

@janicduplessis to confirm, that does not need to be on hold for the RNW update, right?

[janicduplessis]

It still does, that was the one fix that needed the RNW update. If we want we could apply the fix only for native if we want to avoid the hold on RNW update.

[mountiny]

Thanks for confirming, now I remember the sidebarData. Thanks!

[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.3.73-1 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

• Increase VirtualizedList batch size on iOS and Android #19345

If no regressions arise, payment will be issued on 2023-10-02. 🎊

After the hold period is over and BZ checklist items are completed, please complete any of the applicable payments for this issue, and check them off once done.

• External issue reporter
• Contributor that fixed the issue
• Contributor+ that helped on the issue and/or PR

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

• @janicduplessis does not require payment (Contractor)
• @hannojg does not require payment (Contractor)
• @hannojg does not require payment (Contractor)

As a reminder, here are the bonuses/penalties that should be applied for any External issue:

• Merged PR within 3 business days of assignment - 50% bonus
• Merged PR more than 9 business days after assignment - 50% penalty

[melvin-bot]

@janicduplessis, @hannojg, @mountiny Whoops! This issue is 2 days overdue. Let's get this updated quick!

[melvin-bot]

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

[melvin-bot]

Bug0 Triage Checklist (Main S/O)

• This "bug" occurs on a supported platform (ensure Platforms in OP are ✅)
• This bug is not a duplicate report (check E/App issues and #expensify-bugs)
  • If it is, comment with a link to the original report, close the issue and add any novel details to the original issue instead
• This bug is reproducible using the reproduction steps in the OP. S/O
  • If the reproduction steps are clear and you're unable to reproduce the bug, check with the reporter and QA first, then close the issue.
  • If the reproduction steps aren't clear and you determine the correct steps, please update the OP.
• This issue is filled out as thoroughly and clearly as possible
  • Pay special attention to the title, results, platforms where the bug occurs, and if the bug happens on staging/production.
• I have reviewed and subscribed to the linked Slack conversation to ensure Slack/Github stay in sync

[mountiny]

Hello @isabelastisser Can you please pay $500 to @sobitneupane for review and testing of this PR? Thanks!

[sobitneupane]

#15163 (comment)

Requested payment on newDot

[mountiny]

Thanks then we can close this one

[JmillsExpensify]

$500 payment approved for @sobitneupane based on this comment.