Skip to content

[mobile] fix position issue using requestAnimationFrame#23

Merged
divazbozz merged 5 commits intomainfrom
dz/local_test_2
Jan 28, 2026
Merged

[mobile] fix position issue using requestAnimationFrame#23
divazbozz merged 5 commits intomainfrom
dz/local_test_2

Conversation

@divazbozz
Copy link
Contributor

@divazbozz divazbozz commented Jan 27, 2026

Problem

  • we have a hero image loading on /get-started
  • the hero image has no explicit dimensions, so it causes a layout shift when it loads. The
    ResizeObserver on document.documentElement might not reliably catch this on mobile browsers.

Solve

  • use raf requestAnimationFrame to handle our resize event
    • we will only update position when necessary (by calculation position change)
    • when isActivated (meaning user click into address component and is focused) we stop pollin raf as the position is set by the open() method, and at this point no further layout drift should happen, so we cancel the polling.

Testing

mobile safari view

ScreenRecording_01-27-2026.17-08-09_1.MP4

@divazbozz divazbozz changed the title local test [mobile] fix position issue using requestAnimationFrame Jan 27, 2026
@divazbozz divazbozz requested a review from bkobelan January 27, 2026 23:20
@divazbozz divazbozz merged commit 1c7a028 into main Jan 28, 2026
1 check passed
@divazbozz divazbozz deleted the dz/local_test_2 branch January 28, 2026 04:33
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants