Progressive Image Loading Library – Antimoderate.js

Preview:

Description:

Antimoderate.js is a lightweight, standalone JavaScript library for progressively loading images with a blur effect to reduce the page load time. Depending on the StackBlur Algorithm created by Mario Klingemann.

The goal is to load and render nicely blurred micro images on the page while loading full sized images in background which replace as they finish.

How to use it:

Add an image into your document and use data-antimoderate-idata attribute to specify the blurred image encoded in Base64.

<img class="antimoderate" 
 id="demo"
 data-antimoderate-scale="1" 
 data-antimoderate-idata="data:image/jpg;base64, ..."
>

Include the Antimoderate.js JavaScript library on your web page.

<script src="antimoderate.js"></script>

Active the AntiModerate.

var img = document.getElementById('demo');
AntiModerate.process(img, img.getAttribute("data-antimoderate-idata"));