A Rust implementation of the blurhash algorithm.
It is compiled to WebAssembly (WASM), and available on npm as blurhash-wasm.
BlurHash is an algorithm written by Dag Ågren and folks at Wolt (woltapp/blurhash). BlurHash is "a compact representation of a placeholder for an image." It enables you to store that representation in your database. It can then be transferred together with the initial data, in order to decode and show it, before the main image request has finished (or even started).
You will need a package manager, either npm (comes with node) or yarn.
You will also need a bundler, webpack or Rollup, configured for your project.
Then, in a terminal:
npm install blurhash-wasm
# Or, yarn add blurhash-wasmThe demo app source has a complete example of using blurhash-wasm.
import * as blurhash from "blurhash-wasm";
// You can use this to construct canvas-compatible resources
try {
const pixels = blurhash.decode("LKO2?U%2Tw=w]~RBVZRi};RPxuwH", 40, 30);
} catch (error) {
console.log(error);
}Implented, aim to be published in 0.3.0
You will need Rust and Cargo.
Add the version you want to Cargo.toml:
[dependencies]
blurhash-wasm = "0.1.0"
use blurhash_wasm;
// Result<Vec<u8>, blurhash::Error>
let res = blurhash::decode("LKO2?U%2Tw=w]~RBVZRi};RPxuwH", 40, 30);Implented, aim to be published in 0.3.0
Based on the rust wasm-pack template
This template is designed for compiling Rust libraries into WebAssembly and publishing the resulting package to NPM.
Be sure to check out other wasm-pack tutorials online for other
templates and usages of wasm-pack.
wasm-pack build
wasm-pack test --headless --firefox
wasm-pack publish
wasm-bindgenfor communicating between WebAssembly and JavaScript.console_error_panic_hookfor logging panic messages to the developer console.wee_alloc, an allocator optimized for small code size.