fast-blurhash
v1.1.4
Published
Fast and tiny js decoder for the Wolt BlurHash algorithm
Downloads
60,789
Maintainers
Readme
fast-blurhash
Fast & tiny Wolt BlurHash decoder implementation
- 🤏 Tiny: ≈1kb minified
- 🚀 Fast: up to 70% faster then original
blurhash.decode
(see benchmark)
Install
npm install --save fast-blurhash
API
decodeBlurHash
fast-blurhash
provides a drop-in replacement for original blurhash.decode
decodeBlurHash(blurhash: string, width: number, height: number, punch?: number) => Uint8ClampedArray`
decodeBlurHash
uses approximate calculation for speed reasons. Results may slightly differ from original blurhash.decode
but the diff is not noticeable (see tests).
⚠️ decodeBlurHash
does not validate input.
Example
import { decodeBlurHash } from 'fast-blurhash';
// decode blurHash image
const pixels = decodeBlurHash('LEHV6nWB2yk8pyo0adR*.7kCMdnj', 32, 32);
// draw it on canvas
const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
const imageData = ctx.createImageData(width, height);
imageData.data.set(pixels);
ctx.putImageData(imageData, 0, 0);
document.body.append(canvas);
getBlurHashAverageColor
getBlurHashAverageColor(blurhash: string) => [number, number, number]`
getBlurHashAverageColor
returns an average color of a passed blurhash image in [red, green, blue].
Example
import { getBlurHashAverageColor } from 'fast-blurhash';
// get image average color and use it as css background color
const rgbAverageColor = getBlurHashAverageColor('LEHV6nWB2yk8pyo0adR*.7kCMdnj');
document.body.style.backgroundColor = `rgb(${rgbAverageColor.join(',')})';