next-progressive-image
v1.0.5
Published
A React component for progressive image loading with a low-res blur effect.
Downloads
176
Maintainers
Keywords
Readme
next-progressive-image
A lightweight React component for progressive image loading, designed for Next.js projects. This component initially displays a low-resolution blurred image, then swaps it with a high-resolution image once it's fully loaded, improving user experience and performance.
Installation
To install the package, use npm or yarn:
npm install next-progressive-image
Example
import React from "react";
import ProgressiveImage from "your-package-name";
function App() {
return (
<div>
<ProgressiveImage
lowResSrc="path/to/low-res-image.jpg"
highResSrc="path/to/high-res-image.jpg"
alt="A beautiful scenery"
width="500px"
height="300px"
/>
</div>
);
}
export default App;