lbry-desktop/ui/effects
infinite-persistence f7cf21b661 useLazyLoading: start loading when near viewport
## Issue
#6332 <Thumbnail lazy-loader is too slow || Use browser-level lazy-loading>

## Change
Switch from "threshold-based check" to "viewport distance comparison" using the `rootMargin` parameter. The root is the viewport.

This change makes it closer to the native `loading="lazy"` behavior, where it starts to load when approaching the viewport. Chrome I believe uses 3000px distance -- I think 500px is a good compromise for now. Can adjust further.

## Future
- We are currently creating N instances of IntersectionObserver.
  - https://developers.google.com/web/updates/2016/04/intersectionobserver
  - "If you need to observe multiple elements, it is both possible and advised to observe multiple elements using the same IntersectionObserver instance by calling observe() multiple times."

This would probably need a refactor to make ClaimList (or something higher) own the IntersectionObserver.
2021-07-12 17:06:30 -04:00
..
use-combined-refs.js fixes button hover 2019-11-19 16:28:59 -05:00
use-drag-drop.js Support drag-and-drop file publishing (#4170) 2020-05-25 10:27:36 -04:00
use-fetched.js refactor lbrytv web server 2019-11-11 13:27:29 -05:00
use-get-ads.js fetch ads provider for all homepage videos (but still only show ads for unauth users) 2021-04-26 16:38:33 -04:00
use-get-livestreams.js useGetLivestreams: add ability to filter by minimum viewers 2021-04-30 14:11:42 -04:00
use-get-thumbnail.js wip 2021-06-08 13:25:52 -04:00
use-history-nav.js Desktop: Enable 'Alt+Left/Right' for history navigation. 2020-12-30 14:55:24 -05:00
use-hover.js fix: better hover use-effect 2020-04-23 13:10:41 -04:00
use-is-mounted.js prevent state updates after component unmounted 2020-05-13 10:18:36 -04:00
use-lazy-loading.js useLazyLoading: start loading when near viewport 2021-07-12 17:06:30 -04:00
use-lighthouse.js Wunderbar: change throttle to debounce + add min chars 2021-06-23 14:15:59 -04:00
use-persisted-state.js Fix channel reply switching channels. 2020-05-01 14:46:29 -04:00
use-previous.js refactor lbrytv web server 2019-11-11 13:27:29 -05:00
use-screensize.js new layout 🕺 2020-09-29 17:12:32 -04:00
use-stream-file.js prevent state updates after component unmounted 2020-05-13 10:18:36 -04:00
use-stream.js flow fixes 2020-12-16 10:52:22 -05:00
use-throttle.js wunderbar improvements 2020-12-03 12:39:12 -05:00
use-tween.js refactor lbrytv web server 2019-11-11 13:27:29 -05:00
use-zoom.js Make zoom level persistent on Desktop 2021-01-26 10:20:59 -05:00