Performance issue on overscroll due to the presence of a "scroll" event listener
Environment
- Elixir version (elixir -v):
Erlang/OTP 26 [erts-14.2.5] [source] [64-bit] [smp:8:8] [ds:8:8:10] [async-threads:1] [jit] [dtrace]
Elixir 1.17.2 (compiled with Erlang/OTP 26)
- Phoenix version (mix deps):
1.7.14
- Phoenix LiveView version (mix deps):
1.0.0-rc.6 - Operating system:
macOS Sonoma 14.5 (23F79) arm64 - Browsers you attempted to reproduce this bug on (the more the merrier):
Arc Browser
{
"arcVersion" : "1.60.0 (53678)",
"deviceInfo" : {
"deviceId" : "Mac15,3",
"osVersion" : "MacOS Version 14.5 (Build 23F79)"
},
}
Running with chromium : Chromium Engine Version 128.0.6613.138
- Does the problem persist after removing "assets/node_modules" and trying again? Yes/no: yes
Actual behavior
Several times I've detected a drop in framerate on local phoenix liveview applications and on sites deployed online. The drop in performance occurs during an “overscroll”, when the user uses a touchpad to scroll to the top of the page, a bounce effect is rendered and it is this animation that is slowed down.
When JavaScript is disabled, the issue disappears. The issue happens only on Arc Browser
Phoenix live view websites where the issue is detected :
https://github.com/user-attachments/assets/a5578ced-7b8a-44df-88b8-e4bcb5365d64
https://github.com/user-attachments/assets/1df85914-7b36-436f-b094-130ff4187436
I've noticed that when a CSS animation or other continuous rendering eliminates this problem
https://github.com/MatteoGauthier/phoenix-live-perf-overscroll-arc-repro.git
https://github.com/user-attachments/assets/b2e0eb2c-f759-4e0e-a1b9-9ee64f905bbc
I think it's the bindNav method that's causing the problem, as it includes an event listener for the scroll event. https://github.com/phoenixframework/phoenix_live_view/blob/94c87e1a25b2d25dd34ee80798abb6b961620530/assets/js/phoenix_live_view/live_socket.js#L716C5-L721C7
When this eventListener is disabled the issue disappear.
https://github.com/user-attachments/assets/5a9a2e99-ed1b-4ca0-bdd9-bc7c8ca41912
Expected behavior
No performance drop on scroll
Thank you for the report. If it only happens on Arc, then it may an Arc issue first and foremost. Have you tried isolating it and/or reporting it upstream?
Thank you for the report. If it only happens on Arc, then it may an Arc issue first and foremost. Have you tried isolating it and/or reporting it upstream?
Hey @josevalim ! Yes the issue as been reported to the Arc team as well 👍
The only thing we're doing in the scroll listener is setting and resetting a timer, so I don't think there's anything to be done on our side. Thanks!