Smooth loader

Appearance

Documentation ​

Introduction ​

Smooth Loader enables seamless lazy loading of images and background images. Lazy Loading postpones the loading of images that aren't immediately visible on the page. Images outside the user's viewport are loaded only when the user scrolls and they come into view. If the user doesn't scroll, those images are never loaded, saving bandwidth and improving page performance.

This package is an essential tool for any website with multiple images, offering high configurability and performance. Smooth Loader is arguably the best lazy loading package on NPM, tailored to fit your needs.

Features ​

  • 😍 Comprehensive documentation
  • 😍 Built with TypeScript
  • 😍 Lightweight and efficient
  • 😍 Supports both img tags and background images
  • 😍 Smooth fade-in animation for image loading
  • 😍 Displays a low-resolution image preview during the initial page load for image elements
  • 😍 Fully configurable to suit your requirements

When to Use? ​

Image Preview feature is useful in the following cases:

  • When you have a lot of images on the page and you want to improve the user experience
  • When users have a slow internet connection and images are loading slowly
  • When you have few images on the page but they are heavy and take time to load
  • When you have GIFs on the page that are loading slowly

Quick Start ​

To install Smooth Loader you need to follow these steps:

Install with NPM ​

bash
npm i smooth-loader

Install with Yarn ​

bash
yarn add smooth-loader

Install with Ban ​

bash
ban add smooth-loader