Movable TypeでBlurHashのハッシュ値を出力できるようにするプラグインです。
以下のように、画像にダウンロードを待つ間にプレイスホルダー的にぼやけた画像を表示ことができるようになります。ぼやけた画像は1画像あたり30文字程度に圧縮されているのでHTMLと一緒にドキュメントに埋め込んでレスポンスとして返して、JavaScriptでcanvas要素で表示させるというやり方になっています。（疑似的に3G回線程度の速度でアクセスした状態にして動画を収録しています）
使い方
プラグインをインストールするとmt:AssetBlurHashタグが使えるようになります。以下のようなテンプレートで、画像のアセットのあるコンテキストでmt:AssetBlurHashを使ってハッシュ値を書き出します。
ハッシュ値を画像にするのはウェブページの場合にはJavaScriptを使うことになりますが、「読み込むだけで表示してくれるJavaScript」のようなものは用意されていないので、自分で用意する必要があります。そこはちょっと面倒ではありますが、デコードするライブラリはnpmでインストールすることはできるので、プラグインのデモに含まれている以下の程度の簡単なJavaScript（TypeScript）で表示することができます。
サポートしている環境
- Movable Type 7
利用可能なImageDriver
- ImageMagick
- GraphicsMagick
- Imager
ユーザー体験的にどうなのか？
個人的な意見としては、ぼやっと表示されることで確かに雰囲気はでるものの、正直なところこれだけで大きくユーザー体験が改善されるかというとちょっと分からないなと思っています。（しかしデータをとったら、きちんと体験が改善されているという結果がでるという可能性も大いにあると思いますが）
とはいえ、そこまで確かなものでもないとしても、表現の選択肢の一つとして持っておくにはよいものかなと思っています。