feat: Prefetch all links as they enter the viewport #11293
Conversation
| @@ -26,12 +26,12 @@ import { ContextMenuArtwork } from "app/Components/ContextMenu/ContextMenuArtwor | |||
| import { DurationProvider } from "app/Components/Countdown" | |||
| import { Disappearable, DissapearableArtwork } from "app/Components/Disappearable" | |||
| import { ProgressiveOnboardingSaveArtwork } from "app/Components/ProgressiveOnboarding/ProgressiveOnboardingSaveArtwork" | |||
| import { RouterLink } from "app/Components/RouterLink" | |||
There was a problem hiding this comment.
Can we place all system-level things in the System folder? https://github.com/artsy/eigen/tree/main/src/app/system/navigation
(in general, we should leverage this folder more for framework-y things -- cc @MounirDhahri)
There was a problem hiding this comment.
Good idea! I'll move the component to the systems folder 👍
|
|
||
| return ( | ||
| <ElementInView onVisible={handleVisible}> | ||
| <Touchable {...restProps} onPress={handlePress} /> |
There was a problem hiding this comment.
I wonder here if Touchable would be our preferred way, sometimes we use TouchableOpacity and sometimes we use TouchableWithoutHighlight.
Anyway, that's a problem for later, we can start with this now and extend it later.
There was a problem hiding this comment.
Maybe this is a call to use RouterTouchableOpacity 🤷
There was a problem hiding this comment.
I used the Touchable component from "@artsy/palette-mobile" and figured this is probably the preferred one. It has a prop to adjust the opacity on press.
Yeah, RouterTouchableOpacity or RouterTouchable could also be good names for this component. I took the name RouterLink from Force but haven't thought much about naming yet. I'm very open for ideas for the naming.
This PR resolves ONYX-1461
Description
This is an effort to prefetch all links as they enter the viewport.
This PR introduces a
RouterLinkcomponent that wraps Palette'sTouchableand takes an extratoprop with a URL or path to link to. If prefetching is enabled, the component automatically prefetches the URL or path as soon as it enters the viewport.PR Checklist
To the reviewers 👀
Changelog updates
Changelog updates
Cross-platform user-facing changes
iOS user-facing changes
Android user-facing changes
Dev changes
Need help with something? Have a look at our docs, or get in touch with us.