[valleyer]

Neat concept.

As someone not very up-to-date in Web UI techniques, I was curious as to how the array was being advanced on scroll. Unfortunately, it looks like the answer is basically polling. The code constantly calls window.requestAnimationFrame(), checking window.pageYOffset. This means that the page is constantly doing work, even at idle.

Surely the more correct way is to install an onscroll handler or something, right?

[vincentriemer]

The correct way would be a mix of those two strategies: an onscroll handler that schedules an update through requestAnimationFrame (ensuring that it only gets scheduled once until the next frame update actually executes).

[goatherders]

The correct way is the way that works, which this does.

[osrec]

Well, perhaps, but it's unnecessarily inefficient.

[tekromancr]

I mean, it's inefficient as for the 120 seconds you play with it. I don't think it's worth spending more time trying to perfect something like this.

[framecowbird]

it barely works for me on mobile. very jittery

[have_faith]

Request animation frame exists specifically to avoid ‘traditional’ polling. You’re thinking more of setInterval() which is the old way of doing it. The requestAnimationFrame docs are a good read, there are lots of performance benefits.