App: [HOLD for payment 2024-03-19] [$250] [Performance] optimise sorting for nonArchivedReports

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

Version Number: Reproducible in staging?: Reproducible in production?: If this was caught during regression testing, add the test name, ID and link from TestRail: Email or phone of affected tester (no customers): Logs: https://stackoverflow.com/c/expensify/questions/4856 Expensify/Expensify Issue URL: Issue reported by: Slack conversation:

PR is a part of Callstack performance audit of the app

In this PR, hot path of sorting nonArchivedReports inside of getOrderedReportIDs was optimised to return early when dates are sufficient to be used as a comparison criterion.

Platforms:

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

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

Screenshots/Videos

Add any screenshot/video evidence

View all open jobs on GitHub

Upwork Automation - Do Not Edit

Upwork Job URL: https://www.upwork.com/jobs/~010fd35a8396dac225
Upwork Job ID: 1765757106598993920
Last Price Increase: 2024-03-07

About this issue

Original URL
State: closed
Created 4 months ago
Comments: 15 (2 by maintainers)

Most upvoted comments

Proposal

Please re-state the problem that we are trying to solve in this issue.

optimize sorting for nonArchivedReports

What is the root cause of that problem?

compareDisplayNames is being computed unnecessarilly if compareDates is true. This is the bottleneck. https://github.com/Expensify/App/blob/f550e841ee5404016d7201f9f5b7a5bec71a410f/src/libs/SidebarUtils.ts#L166-L168

What changes do you think we should make in order to solve the problem?

Check compareDates in an if statement:


nonArchivedReports.sort((a, b) => {
    const compareDates =
      a?.lastVisibleActionCreated && b?.lastVisibleActionCreated
        ? compareStringDates(
            b.lastVisibleActionCreated,
            a.lastVisibleActionCreated
          )
        : 0;

//check if here
    if (compareDates) {
        return compareDates;
    }
    const compareDisplayNames =
      a?.displayName && b?.displayName
        ? a.displayName.toLowerCase().localeCompare(b.displayName.toLowerCase())
        : 0;
    return compareDisplayNames;

What alternative solutions did you explore? (Optional)

muas19 on Mar 8, 2024