4 ms·

I don't like infinite scroll but for another reason not mentioned here. If you're browsing something that's content heavy (lots of pictures/videos) there's usu

by alan_n 8y ago

I don't like infinite scroll but for another reason not mentioned here. If you're browsing something that's content heavy (lots of pictures/videos) there's usually a point after a certain number of "pages" where my phone just can't take so many things loaded at once and it crashes. Not all sites have this problem, some are really bad (\cough\ tumblr \cough\) but it makes me avoid infinite scrolling sites at all costs. The ones with "Read More" are slightly better (the crash doesn't happen unexpectedly x pixels from the bottom), but still have this problem. I thought at one point unloading the content at the top might help, but I'm not so sure now. Discourse forums do something like this, where they only load what you're viewing but it feels weird, like it's loading things it's already loaded. Sometimes I do want to scroll to the bottom of something and feel like it's all loaded everything for offline reading. But overall by far I prefer sites/blogs that have paginated content.

vmasto 8y 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).
- minitech 8y ago
  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.)
  - joshpearson 8y ago
    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.
    - minitech 8y ago
      I don’t, sorry. If regular pagination is at all an option for you, that’s a safe and user-friendly choice.
      - deleted 8y ago
        [deleted]
    - thinkloop 8y ago
      This site does it: http://www.goodlist.co/ 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.
      - minitech 8y ago
        > 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.
  - delecti 8y ago
    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?
    - minitech 8y ago
      The new layout for profile pages is where I noticed this problem. No RES.
rapnie 8y ago
I think Discourse does a nice job. It changes the URL in the address bar as you scroll down to viewed post ID, and I believe (but can't check now) that is has entire content loaded in the page, and just does the rendering of the viewport as you go down. Don't know how it handles 'JS disabled' case, though.
- zbrozek 8y ago
  Discourse is one of my go-to examples of a terrible site that I will actively avoid. The find in page is terrible. It makes it impossible to find anything ever. Octoprint moved its documentation there and I'm really unhappy about it.
- alan_n 8y ago
  I like most things about discourse except the scrolling/loading. If you skip around with the bar on the side it's always loading where you skip to, which is fine, except it only loads what's in the viewport, no posts before/after, so if you skip back to a loaded part but you're off by one post, it does the loading thing again. Just feels weird. Also I just double checked and it loads content as you scroll which I usually don't want for a forum. I usually don't complain about the find feature with most infinite scroll sites but only because they don't hijack it. The find feature for discourse is AWFUL just awful.
the8472 8y ago
At least Firefox does unload images outside the viewport. But it still has to store layout information of all the preceding elements to determine their placement in the document Right now nightly says (9k posts) │ ├──434.20 MB (48.20%) -- top(<anonymized-4294967585>, id=4294967297) │ │ ├──429.00 MB (47.62%) -- active/window(<anonymized-4294967585>) │ │ │ ├──292.77 MB (32.50%) -- layout │ │ │ │ ├──109.99 MB (12.21%) ++ computed-values │ │ │ │ ├───77.96 MB (08.65%) ++ style-structs │ │ │ │ ├───71.80 MB (07.97%) ++ frames │ │ │ │ ├───23.33 MB (02.59%) ++ (8 tiny) │ │ │ │ └────9.70 MB (01.08%) ── text-runs │ │ │ ├──121.27 MB (13.46%) ++ dom │ │ │ ├────9.52 MB (01.06%) ── property-tables │ │ │ └────5.44 MB (00.60%) ++ (2 tiny) Reloading the page with only 100 posts: │ ├───6.14 MB (04.16%) -- top(<anonymized-4294969763>, id=4294967297) │ │ ├──4.98 MB (03.38%) -- active/window(<anonymized-4294969763>) │ │ │ ├──2.82 MB (01.91%) ++ layout │ │ │ └──2.17 MB (01.47%) ++ (4 tiny) │ │ └──1.16 MB (00.78%) ++ js-zone(0x21964428000) So at least in this case it's actually Layout and DOM nodes that dominate memory consumption, not the images or javascript.
phreack 8y ago
There's an option on Tumblr desktop settings to disable endless scrolling. It's still terrible that it's only desktop mode, but it's still usable like that on mobile.
- alan_n 8y ago
  I don't actually log into tumblr itself. It's just I'll often stumble upon a blog through a search or a link, and every time I see a tumblr infinite scrolling theme (i think it's the default one?) I want to scream. The worst ones are the ones were even single posts have infinite scrolling. Ugh. I don't use any social media to actually read much of anything I'm already following. I use all RSS feeds. No bloated interface. No blackhole of content. The RSS reader I use (inoreader) is technically infinite scrolling now that I think about it, but it's the only instance I don't mind because I usually read it on my desktop, I never scroll back up (I star anything interesting), and who searches new articles?, and there's a good search for finding things again which I almost never use.

by alan_n 8y ago

vmasto 8y 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).

minitech 8y ago
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.)
- joshpearson 8y ago
  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.
  - minitech 8y ago
    I don’t, sorry. If regular pagination is at all an option for you, that’s a safe and user-friendly choice.
    - deleted 8y ago
      [deleted]
  - thinkloop 8y ago
    This site does it: http://www.goodlist.co/ 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.
    - minitech 8y ago
      > 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.
- delecti 8y ago
  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?
  - minitech 8y ago
    The new layout for profile pages is where I noticed this problem. No RES.

rapnie 8y ago

I think Discourse does a nice job. It changes the URL in the address bar as you scroll down to viewed post ID, and I believe (but can't check now) that is has entire content loaded in the page, and just does the rendering of the viewport as you go down. Don't know how it handles 'JS disabled' case, though.

zbrozek 8y ago
Discourse is one of my go-to examples of a terrible site that I will actively avoid. The find in page is terrible. It makes it impossible to find anything ever. Octoprint moved its documentation there and I'm really unhappy about it.
alan_n 8y ago
I like most things about discourse except the scrolling/loading. If you skip around with the bar on the side it's always loading where you skip to, which is fine, except it only loads what's in the viewport, no posts before/after, so if you skip back to a loaded part but you're off by one post, it does the loading thing again. Just feels weird. Also I just double checked and it loads content as you scroll which I usually don't want for a forum. I usually don't complain about the find feature with most infinite scroll sites but only because they don't hijack it. The find feature for discourse is AWFUL just awful.

the8472 8y ago

At least Firefox does unload images outside the viewport. But it still has to store layout information of all the preceding elements to determine their placement in the document Right now nightly says (9k posts) │ ├──434.20 MB (48.20%) -- top(<anonymized-4294967585>, id=4294967297) │ │ ├──429.00 MB (47.62%) -- active/window(<anonymized-4294967585>) │ │ │ ├──292.77 MB (32.50%) -- layout │ │ │ │ ├──109.99 MB (12.21%) ++ computed-values │ │ │ │ ├───77.96 MB (08.65%) ++ style-structs │ │ │ │ ├───71.80 MB (07.97%) ++ frames │ │ │ │ ├───23.33 MB (02.59%) ++ (8 tiny) │ │ │ │ └────9.70 MB (01.08%) ── text-runs │ │ │ ├──121.27 MB (13.46%) ++ dom │ │ │ ├────9.52 MB (01.06%) ── property-tables │ │ │ └────5.44 MB (00.60%) ++ (2 tiny) Reloading the page with only 100 posts: │ ├───6.14 MB (04.16%) -- top(<anonymized-4294969763>, id=4294967297) │ │ ├──4.98 MB (03.38%) -- active/window(<anonymized-4294969763>) │ │ │ ├──2.82 MB (01.91%) ++ layout │ │ │ └──2.17 MB (01.47%) ++ (4 tiny) │ │ └──1.16 MB (00.78%) ++ js-zone(0x21964428000) So at least in this case it's actually Layout and DOM nodes that dominate memory consumption, not the images or javascript.

phreack 8y ago

There's an option on Tumblr desktop settings to disable endless scrolling. It's still terrible that it's only desktop mode, but it's still usable like that on mobile.

alan_n 8y ago
I don't actually log into tumblr itself. It's just I'll often stumble upon a blog through a search or a link, and every time I see a tumblr infinite scrolling theme (i think it's the default one?) I want to scream. The worst ones are the ones were even single posts have infinite scrolling. Ugh. I don't use any social media to actually read much of anything I'm already following. I use all RSS feeds. No bloated interface. No blackhole of content. The RSS reader I use (inoreader) is technically infinite scrolling now that I think about it, but it's the only instance I don't mind because I usually read it on my desktop, I never scroll back up (I star anything interesting), and who searches new articles?, and there's a good search for finding things again which I almost never use.