Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix laggy scrolling on mobile app's home screen, etc. #4108

Merged
merged 3 commits into from
May 21, 2024
+24 −10
Merged

Fix laggy scrolling on mobile app's home screen, etc. #4108

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
d8b2721
Improve scrolling performance for List
zetavg May 19, 2024
d1423dd
Update List.tsx
gaearon May 21, 2024
ef34c05
Apply same fix to profile labels
gaearon May 21, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 12 additions & 5 deletions src/screens/Profile/Sections/Labels.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -111,20 +111,27 @@ export function ProfileLabelsSectionInner({
headerHeight: number
}) {
const t = useTheme()
const contextScrollHandlers = useScrollHandlers()

// Intentionally destructured outside the main thread closure.
// See https://github.com/bluesky-social/social-app/pull/4108.
const {
onBeginDrag: onBeginDragFromContext,
onEndDrag: onEndDragFromContext,
onScroll: onScrollFromContext,
onMomentumEnd: onMomentumEndFromContext,
} = useScrollHandlers()
const scrollHandler = useAnimatedScrollHandler({
onBeginDrag(e, ctx) {
contextScrollHandlers.onBeginDrag?.(e, ctx)
onBeginDragFromContext?.(e, ctx)
},
onEndDrag(e, ctx) {
contextScrollHandlers.onEndDrag?.(e, ctx)
onEndDragFromContext?.(e, ctx)
},
onScroll(e, ctx) {
contextScrollHandlers.onScroll?.(e, ctx)
onScrollFromContext?.(e, ctx)
},
onMomentumEnd(e, ctx) {
contextScrollHandlers.onMomentumEnd?.(e, ctx)
onMomentumEndFromContext?.(e, ctx)
},
})

Expand Down
17 changes: 12 additions & 5 deletions src/view/com/util/List.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,22 +44,29 @@ function ListImpl<ItemT>(
ref: React.Ref<ListMethods>,
) {
const isScrolledDown = useSharedValue(false)
const contextScrollHandlers = useScrollHandlers()
const pal = usePalette('default')

function handleScrolledDownChange(didScrollDown: boolean) {
onScrolledDownChange?.(didScrollDown)
}

// Intentionally destructured outside the main thread closure.
// See https://github.com/bluesky-social/social-app/pull/4108.
const {
onBeginDrag: onBeginDragFromContext,
onEndDrag: onEndDragFromContext,
onScroll: onScrollFromContext,
onMomentumEnd: onMomentumEndFromContext,
} = useScrollHandlers()
const scrollHandler = useAnimatedScrollHandler({
onBeginDrag(e, ctx) {
contextScrollHandlers.onBeginDrag?.(e, ctx)
onBeginDragFromContext?.(e, ctx)
},
onEndDrag(e, ctx) {
contextScrollHandlers.onEndDrag?.(e, ctx)
onEndDragFromContext?.(e, ctx)
},
onScroll(e, ctx) {
contextScrollHandlers.onScroll?.(e, ctx)
onScrollFromContext?.(e, ctx)

const didScrollDown = e.contentOffset.y > SCROLLED_DOWN_LIMIT
if (isScrolledDown.value !== didScrollDown) {
Expand All @@ -72,7 +79,7 @@ function ListImpl<ItemT>(
// Note: adding onMomentumBegin here makes simulator scroll
// lag on Android. So either don't add it, or figure out why.
onMomentumEnd(e, ctx) {
contextScrollHandlers.onMomentumEnd?.(e, ctx)
onMomentumEndFromContext?.(e, ctx)
},
})

Expand Down
Loading