Displaying 1 to 8 from 8 results

quicklink - ⚡️Faster subsequent page-loads by prefetching in-viewport links during idle time

  •    Javascript

This project aims to be a drop-in solution for sites to prefetch links based on what is in the user's viewport. It also aims to be small (< 1KB minified/gzipped). You can also grab quicklink from unpkg.com/quicklink.

react-simple-img - 🌅 React lazy load images with IntersectionObserver API and Priority Hints

  •    Javascript

Image component working similar with standard img tag and with the following props. This function is only required, when you want to customise intersection observer configuration.

peekaboo - Know when elements are about to scroll into the viewport

  •    Javascript

Fires a one-time event whenever elements of your choice are about to scroll into the viewport. Perfect for just-in-time asset loading, for example; images, javascript libraries such as twitter and facebook, article comments or 3rd party advertisments. See the gitHub pages demo site for more info.

ViewabilityHelper - Lightweight cross-browser library that enables you to create a watcher for a given element, and receive a callback for it's intersections with the viewport

  •    Javascript

Viewability Helper uses Intersection Observer API if available. If it's not, the library makes the calculations itself. Browser support for the Intersection Observer API can be found here. Note: Not working when Intersection Observer is not supported and the script is running inside an iframe.


  •    TypeScript

ng-defer-load is an Angular directive to load elements lazily. It uses Intersection Observer API to check if an element is in viewport and falls back to scroll detection mechanism for unsupported browsers.

vue-intersect - A Vue component to add intersection-observer to a Vue component or HTML element.

  •    Javascript

A Vue component to add intersection-observer to a Vue component or HTML element. The IntersectionObserver is an amazing API which allows you to observe one or more HTMLElement for when it has entered or left the viewport.

vue-clazy-load - Component-based lazy (CLazy) load images in Vue.js 2

  •    Javascript

Swaps between your image and another component when loading images, allowing you to use loaders from component frameworks such as spinners and progress bars. This method also allows transitioning between the two components. Check out the example page.

react-intersection-visible-hook - React Hook to track the visibility of a functional component

  •    Javascript

React hook to track the visibility of a functional component based on IntersectionVisible Observer. In the following example we changed the background color of the body depending on the visibility of the blue box.