Modern React Image Lazy Loading Component

Category: Featured , Image , Loading , React | April 20, 2018
Author: fpapado
Views Total: 144
Official Page: Go to website
Last Update: April 20, 2018
License: MIT

React Lazy Images is a set of component and utilities for lazy image loading in React.

Features:

  • Composable pieces, preloading images, and handling failures.
  • Full presentational control for the caller (render props).
  • Modern, performant implementation, using IntersectionObserver and providing polyfill information.
  • Eager loading / Server-side rendering support.
  • Works with horizontal scrolling supports background images.
  • Fallbacks for SEO / when Javascript is disabled.
  • Easy to understand source code. You should be able to fork and do your thing if desired.
  • Ample documentation to help you understand the problem, in addition to the solutions.

Installation:

# Yarn
$ yarn add react-lazy-images

# NPM
$ npm install react-lazy-images --save

Preview:

Modern React Image Lazy Loading Component