Infinite Scroll: Mobile Flicker

[joebentaylor1995]

I’ve successfully implemented the infinite scroll on desktop and it’s working exactly as intended. However, on mobile, specifically iOS, I’m seeing an issue when reaching the point where the top of the final element aligns with the top of the viewport. This is the moment Lenis restarts the animation loop.

At that transition, the page briefly flickers as the component switches. I’ve stripped out all animations to rule them out as the cause, but the issue persists.

The setup consists of three plus one duplicated elements, each sized at 100lvh and positioned relatively.

At this point I’m a bit stuck on what could be causing the flicker on iOS, and whether this is something that can be resolved at all or if it’s a platform-level limitation.

Live example:
https://jillianphyllis.netlify.app

[clementroche]

ios 26 simply broke the vh based units. https://skwbr.net/sample/sizecheck/
The only solution i see right now is to use an element as scroller, not body.

[joebentaylor1995]

Damn! Ill do this, its not much lift to achieve. I honestly hate the new safari for this stuff its so inconsistent. I hope other people see this issue and it helps them!