Hacker News new | ask | show | jobs
by vmasto 2801 days ago
The technique is called "windowing" and it's not extremely hard to implement properly. For react we have react-virtualized and react-window, and I'm sure there are other libraries for different UI frameworks.

I'm running infinite scroll in production serving thousands of photos and it works pretty well, constant 60fps, low memory consumption and you could literally scroll infinitely (given infinite content).

1 comments

You have to be careful about which types of content you remove, though, to avoid breaking the browser’s Find. (Reddit is an example of a site that currently does this wrong.)
I spent a lot of time on Reddit and have never seen infinite scroll on it except when I had the 3rd party plugin "Reddit Enhancement Suite" installed. Is it in the new layout they pushed out recently, or do you have RES installed?
The new layout for profile pages is where I noticed this problem. No RES.
Do you know of any sites that do it correctly?

I've created various pages that sorta unrenders content, but all of them break the browser's find.

I don’t, sorry. If regular pagination is at all an option for you, that’s a safe and user-friendly choice.
This site does it: http://www.goodlist.co/

If you inspect you will notice that previous invisible items are represented by a single large div who's height increases as more items are scrolled out of view.

> previous invisible items are represented by a single large div

… breaking the browser’s Find. Also, things jump around the page as you scroll down. That site does it decidedly wrong.