import React from "react";
import ProgressiveImage from "react-progressive-image";
import image from "./image.jpg";
import placeholderImage from "./placeholderImage.jpg";
const App = () => {
return (
<ProgressiveImage src={image} placeholder="data:image/png;base64***">
{(src) => <img src={src} alt="an image" />}
</ProgressiveImage>
);
};
export default App;
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter