metafizzy / metafizzy/infinite-scroll

Prevent Infinite Scroll "Preload" Runaway

Open
#941 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
HTML
Stars
7.5k
Forks
1.7k
PR merge metrics
No merged PRs in 30d

Description

**Description**
When preloading, it is currently possible to get stuck in an infinite loop of preload. InfiniteScroll will either need to be able to detect this situations and wait it out, or have a maxPreload value.

**Reproduce**
In order to set up the situation, put a InfiniteScroll'd masonry into an iFrame. But prior to the iFrame loading, make the iFrame have a `display: none;` attribute. When in this situation, the height of any "infinite-scrollers" on the page are presumably forced to 0 due to display: none, so `preload` will preload forever.

Can be reproduced by putting [Conreq](https://github.com/Archmonger/Conreq) into an [Organizr](https://github.com/causefx/Organizr) iframe tab, then immediately clicking on a different tab before Conreq loads.

Struggled to create a codepen for this.

**Potential Resolutions**
1. Have a maxPreload value where the user can enforce a maximum amount of pages that are allowed to be preloaded.
2. If infinite scroll container height stays 0 across the first two preloads, then InfiniteScroll should resort to polling the container and waiting for its height to become a real value.
3. Detect if the user is in an iFrame and/or if the browser window does not have focus. Do not preload until focus is obtained.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing the preload behavior with an InfiniteScroll masonry inside an iframe that is initially display:none, using the Conreq and Organizr setup described. Inspect the preload path and determine how the zero-height container causes repeated preloads; done means preloading no longer runs away while the hidden iframe remains unloaded.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.