[C-5347] Speed up CollectionScreen transition and first render by amendelsohn · Pull Request #10288 · AudiusProject/apps

amendelsohn · 2024-10-30T23:12:13Z

Description

Apply the new Screen deferred loading patterns to CollectionScreen
Moved the TrackList to its own component so we can defer rendering of the track list and kicking off the useFetchCollectionLineup hook

Note: I think we may be able to do better than this, but this change is already a noticeable perf improvement.

How Has This Been Tested?

about half the time to load a CollectionScreen from Feed

changeset-bot · 2024-10-30T23:12:17Z

⚠️ No Changeset found

Latest commit: 9093785

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

dylanjeffers

heck yeah!

dylanjeffers · 2024-10-31T17:32:04Z

packages/mobile/src/screens/collection-screen/CollectionScreenDetailsTile.tsx

    [play]
  )

-  const handlePressTrackListItemPlay = useCallback(


great moving this out of the root

dylanjeffers · 2024-10-31T17:33:15Z

packages/mobile/src/screens/collection-screen/CollectionScreenDetailsTile.tsx

+            </Button>
          ) : null}
+          {shouldShowPreview ? <PreviewButton /> : null}
+          <DetailsTileActionButtons


did you notice that rendering all this lead to some speed issues or was it still okay to render all this in the "PrimaryScreenContent"?

Unfortunately, I wasn't able to get a granular enough measurement for whether this was impacting it or not. I made a follow up ticket to push the callback creation down towards a wrapper around the buttons so we can have <CollectionDetailsTileActionButtons collectionId={collectionId} /> which builds the callbacks and renders <DetailsTileActionButtons /> as secondary content with a skeleton.

Not sure if it's worth the impact or not, and it's kind of nice to have the buttons appear on first render.

dylanjeffers · 2024-10-31T17:33:31Z

packages/mobile/src/screens/collection-screen/CollectionScreenDetailsTile.tsx

+  uids: UID[]
+}
+
+const CollectionTrackList = ({


Co-authored-by: Dharit Tantiviramanond <dharit.tan@gmail.com>

[2c174f7] Update dapp-store build artifacts audius-infra [980b3a3] Upgrade react to 18.3.1 (#10315) Dylan Jeffers [6a8368d] [PAY-3564][PAY-3567][PAY-3566] Rights attribution enhancements (#10307) Farid Salau [d59b743] Add fast crypto patch (#10313) Dylan Jeffers [ae6d881] [C-5342] Upgrade react-native to 0.75 (#10301) Dylan Jeffers [9cf8e42] Use skeletons for track and collection screens (#10310) Andrew Mendelsohn [0d9359b] Fix react-native patch (#10309) Dylan Jeffers [2bf8d52] [QA-1807] Fix Profile Page: Add entry to totalTileHeight map of 140 for grid lineup variant (#10308) Marcus Pasell [5a8730a] Add react-native patch to fix animation error (#10306) Dylan Jeffers [dacd66a] Fix fastlane version number check (#10296) Dylan Jeffers [0915236] [C-5360] Bottom bar screens deferred loading perf improvement (#10305) Andrew Mendelsohn [4fe0ff1] Trim whitespace in discovery node block list (#10303) Sebastian Klingler [cf7cb61] [C-5301] Update track and collectino unfurl string order (#10300) Kyle Shanks [61dc74d] [C-5305] Fix profile page tile text overflowing (#10298) JD Francis [dbee776] Add reply comment animation to web (#10292) Kyle Shanks [0667d35] [PAY-3560] Add cover attribution and publishing rights to RN (#10272) Farid Salau [6806bff] [C-5347] Speed up CollectionScreen transition and first render (#10288) Andrew Mendelsohn [6745685] Make is_stream_gated and is_download_gated nullable in upload schema (#10293) Sebastian Klingler [e3eec4b] [C-5430] Make mobile CTA preferred over sign up CTA (mobile web) (#10281) JD Francis [d569acc] Cleanup TrackScreen snappiness (#10284) Reed [a0ff433] [C-5294] Fix mobile bio description links positioning (#10287) Sebastian Klingler [2e24795] Make track description text selectable on web (#10260) Sebastian Klingler [cd2cda2] [C-5283] Fix comment count bugs + add tests (#10275) JD Francis [27df795] Undo temp hack used during account endpoint migration (#10285) Randy Schott [db1979d] [PAY-3572] Wait for recovery transaction to finalize before polling balance change (#10283) Randy Schott [575515d] [C-5061] Add fade in animation to comments (#10276) Kyle Shanks [182cb49] Upgrade cocoapods to 1.15.2 (#10278) Dylan Jeffers [1c01b35] Fix track updates missing userId (#10280) Randy Schott [6912333] [QA-1794] Reset padding for Safari buttons (#10279) Sebastian Klingler [a20d6b8] Update ios mobile app icons (#10273) Dylan Jeffers [018ad17] [PAY-3414] Remove UserStateManager and switch to loading account from v1 endpoint (#9673) Randy Schott [c812dae] [C-5338] Increase comment page size from 5->15 (#10253) JD Francis [63bb78d] [PAY-3562] Remove sanity checks code (#10261) Raymond Jacobson [8a307c8] [C-5317] Make TrackScreen FAST (#10267) Andrew Mendelsohn [24dfcfa] [C-5311] Upgrade react-native to 0.74 (#10245) Dylan Jeffers [6f1c0fa] [QA-1797] Fix double $ (#10270) Raymond Jacobson [ab3fcf2] [C-5308] Fix react crash in UserGeneratedText (#10266) Sebastian Klingler [2ea69d0] Blur on submit for comments but not DMs (#10265) Isaac Solo [d407b4f] Remove SEARCH_V2 feature flag (#10264) Reed [5e4c963] [C-5309] Reset comment form text on location change (#10263) Kyle Shanks [c23e92d] [PAY-3545] Add cover attribution and song ownership to track upload (#10184) Farid Salau [b0fe062] [C-5314] Add load states for comment display names & avatars (#10255) JD Francis [05dc945] Fix mobile harmony button xs size (#10243) Dylan Jeffers [2ffb5cd] Bump max audio size to 500mb (#10252) Raymond Jacobson [4337866] Upgrade mobile version to 1.1.121 (#10254) Dylan Jeffers [a2803dd] [PAY-3469] Reapply "Update DN to use shortened rewards challenge IDs and specifiers (#9803)" (#10099) (#10158) Marcus Pasell [c805724] Make Text component respect theme typography (#10086) Marcus Pasell [af1cca1] Not hardcoded file limit error message (#10247) JD Francis [1bbba4b] [C-5306] Update UserGeneratedText Links to show url on fetch fail (#10248) Kyle Shanks [da3cc8e] [QA-1789] Fix more by artist width (#10241) Andrew Mendelsohn [2ab68ed] [C-5310] Fix comment notification deep links (#10240) Dylan Jeffers

dharit-tan and others added 17 commits October 28, 2024 16:35

[C-5317] ScreenReady and useIsScreenReady

97418c9

lint

96c7b24

remove duplicate screen options

6309742

put back options for custom screen options

37ce12f

Merge branch 'rt-delight' into am-delight

b012e36

Merge branch 'am-remove-screen-options' into am-delight

49c72f9

Add ScreenContext and cascading content wrappers

cfbdc3b

fast track screen

ae9d509

remove extra skeleton file

acd01ae

PR feedback

c4ef007

documentation

dc962c3

wip

f1c2d6f

Make collection screen load faster

f81aef9

wip

84d8ea4

Merge branch 'main' into am-collection-load

36eaa1a

lineup timing refactor

d533bdd

wrap a couple more things

9093785

amendelsohn requested review from dharit-tan and dylanjeffers October 30, 2024 23:12

pull-request-size bot added the size/L label Oct 30, 2024

dylanjeffers approved these changes Oct 31, 2024

View reviewed changes

amendelsohn merged commit 6806bff into main Oct 31, 2024

amendelsohn deleted the am-collection-load branch October 31, 2024 17:52

dylanjeffers pushed a commit that referenced this pull request Nov 1, 2024

[C-5347] Speed up CollectionScreen transition and first render (#10288)

6dac9a1

Co-authored-by: Dharit Tantiviramanond <dharit.tan@gmail.com>

samgutentag pushed a commit that referenced this pull request Nov 1, 2024

[C-5347] Speed up CollectionScreen transition and first render (#10288)

e1bc22d

Co-authored-by: Dharit Tantiviramanond <dharit.tan@gmail.com>

raymondjacobson mentioned this pull request Dec 17, 2024

[PAY-3677] Fix mobile explore collections #10754

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[C-5347] Speed up CollectionScreen transition and first render#10288

[C-5347] Speed up CollectionScreen transition and first render#10288
amendelsohn merged 17 commits intomainfrom
am-collection-load

amendelsohn commented Oct 30, 2024 •

edited

Loading

Uh oh!

changeset-bot bot commented Oct 30, 2024

Uh oh!

dylanjeffers left a comment

Uh oh!

dylanjeffers Oct 31, 2024

Uh oh!

dylanjeffers Oct 31, 2024

Uh oh!

amendelsohn Oct 31, 2024

Uh oh!

dylanjeffers Oct 31, 2024

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Conversation

amendelsohn commented Oct 30, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

How Has This Been Tested?

Uh oh!

changeset-bot bot commented Oct 30, 2024

⚠️ No Changeset found

Uh oh!

dylanjeffers left a comment

Choose a reason for hiding this comment

Uh oh!

dylanjeffers Oct 31, 2024

Choose a reason for hiding this comment

Uh oh!

dylanjeffers Oct 31, 2024

Choose a reason for hiding this comment

Uh oh!

amendelsohn Oct 31, 2024

Choose a reason for hiding this comment

Uh oh!

dylanjeffers Oct 31, 2024

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

amendelsohn commented Oct 30, 2024 •

edited

Loading