react-lazy-image-loader

Simple lazy loader for React.js + TypeScript ready

Usage no npm install needed!

<script type="module">
  import reactLazyImageLoader from 'https://cdn.skypack.dev/react-lazy-image-loader';
</script>

README

react-lazy-image-loader

Simple lazy loader for React.js

  • TypeScript ready

size

NPM | Github | Feature request

Installation

  • npm install --react-lazy-image-loader
  • yarn add react-lazy-image-loader

How To Use

First import this component where you want to use it

import LazyImage from react-lazy-image-loader"

Then just renders it

<LazyImage src="./link/to/source.jpg" alt="avatar" height={30} width={30} borderRadius={4} />

Props

Prop type Default value
src string none
alt string none
height number? none
width number? none
borderRadius number? 2

Example

import React from "react";
import LazyImage from 'react-lazy-image-loader';


const App = () => {
    return (
        <LazyImage src="./link/to/source.jpg" alt="avatar" height={30} width={30} borderRadius={4} />
    );
}

export { App };