refactor: ⚡ use blurhash-as for encoding and decoding
This commit is contained in:
ThatOneCalculator
parent
17e0601a95
commit
ae059881fb
5 changed files with 37 additions and 14 deletions
|
|
@ -47,7 +47,7 @@
|
|||
"aws-sdk": "2.1413.0",
|
||||
"axios": "^1.4.0",
|
||||
"bcryptjs": "2.4.3",
|
||||
"blurhash": "2.0.5",
|
||||
"blurhash-as": "^0.10.0",
|
||||
"bull": "4.10.4",
|
||||
"cacheable-lookup": "7.0.0",
|
||||
"calckey-js": "workspace:*",
|
||||
|
|
|
|||
|
|
@ -10,11 +10,12 @@ import FFmpeg from "fluent-ffmpeg";
|
|||
import isSvg from "is-svg";
|
||||
import { type predictionType } from "nsfwjs";
|
||||
import sharp from "sharp";
|
||||
import { encode } from "blurhash";
|
||||
import * as blurhash from "blurhash-as";
|
||||
import { detectSensitive } from "@/services/detect-sensitive.js";
|
||||
import { createTempDir } from "./create-temp.js";
|
||||
|
||||
const pipeline = util.promisify(stream.pipeline);
|
||||
blurhash.init();
|
||||
|
||||
export type FileInfo = {
|
||||
size: number;
|
||||
|
|
@ -432,7 +433,13 @@ function getBlurhash(path: string): Promise<string> {
|
|||
let hash;
|
||||
|
||||
try {
|
||||
hash = encode(new Uint8ClampedArray(buffer), width, height, 7, 7);
|
||||
hash = blurhash.encode(
|
||||
new Uint8ClampedArray(buffer),
|
||||
width,
|
||||
height,
|
||||
7,
|
||||
7,
|
||||
);
|
||||
} catch (e) {
|
||||
return reject(e);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -30,6 +30,7 @@
|
|||
"autobind-decorator": "2.4.0",
|
||||
"autosize": "5.0.2",
|
||||
"blurhash": "2.0.5",
|
||||
"blurhash-as": "^0.10.0",
|
||||
"broadcast-channel": "5.1.0",
|
||||
"browser-image-resizer": "github:misskey-dev/browser-image-resizer",
|
||||
"calckey-js": "workspace:*",
|
||||
|
|
|
|||
|
|
@ -4,12 +4,12 @@
|
|||
ref="canvas"
|
||||
:width="size"
|
||||
:height="size"
|
||||
:title="title"
|
||||
:title="title ?? ''"
|
||||
/>
|
||||
<img
|
||||
v-if="src"
|
||||
:src="src"
|
||||
:title="title"
|
||||
:title="title ?? ''"
|
||||
:type="type"
|
||||
:alt="alt"
|
||||
:class="{ cover }"
|
||||
|
|
@ -21,7 +21,8 @@
|
|||
|
||||
<script lang="ts" setup>
|
||||
import { onMounted } from "vue";
|
||||
import { decodeBlurHash } from "fast-blurhash";
|
||||
import * as blurhash from "blurhash-as/browser";
|
||||
import wasmURL from "blurhash-as/build/optimized.wasm?url";
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
|
|
@ -46,9 +47,10 @@ const props = withDefaults(
|
|||
const canvas = $ref<HTMLCanvasElement>();
|
||||
let loaded = $ref(false);
|
||||
|
||||
function draw() {
|
||||
async function draw() {
|
||||
if (props.hash == null || canvas == null) return;
|
||||
const pixels = decodeBlurHash(props.hash, props.size, props.size);
|
||||
blurhash.setURL(wasmURL);
|
||||
const pixels = await blurhash.decode(props.hash, props.size, props.size);
|
||||
const ctx = canvas.getContext("2d");
|
||||
const imageData = ctx!.createImageData(props.size, props.size);
|
||||
imageData.data.set(pixels);
|
||||
|
|
|
|||
|
|
@ -147,9 +147,9 @@ importers:
|
|||
bcryptjs:
|
||||
specifier: 2.4.3
|
||||
version: 2.4.3
|
||||
blurhash:
|
||||
specifier: 2.0.5
|
||||
version: 2.0.5
|
||||
blurhash-as:
|
||||
specifier: ^0.10.0
|
||||
version: 0.10.0
|
||||
bull:
|
||||
specifier: 4.10.4
|
||||
version: 4.10.4
|
||||
|
|
@ -736,6 +736,9 @@ importers:
|
|||
blurhash:
|
||||
specifier: 2.0.5
|
||||
version: 2.0.5
|
||||
blurhash-as:
|
||||
specifier: ^0.10.0
|
||||
version: 0.10.0
|
||||
broadcast-channel:
|
||||
specifier: 5.1.0
|
||||
version: 5.1.0
|
||||
|
|
@ -780,7 +783,7 @@ importers:
|
|||
version: 2.30.0
|
||||
emojilib:
|
||||
specifier: github:thatonecalculator/emojilib
|
||||
version: github.com/thatonecalculator/emojilib/1d6adc1af8105b4937d2f0e7479acf5bd565bd9b
|
||||
version: github.com/thatonecalculator/emojilib/d3c8c6a77d4362b3b3180099f1d2eac344ce245c
|
||||
escape-regexp:
|
||||
specifier: 0.0.1
|
||||
version: 0.0.1
|
||||
|
|
@ -1078,6 +1081,9 @@ packages:
|
|||
'@jridgewell/gen-mapping': 0.3.3
|
||||
'@jridgewell/trace-mapping': 0.3.18
|
||||
|
||||
/@assemblyscript/loader@0.27.5:
|
||||
resolution: {integrity: sha512-DGEJQIKh/pMseal4i26haGutxNfs3nGzwY0MNseoFKcE3DKIXQ25deWpNOqIJQPvjS4FKH+oUpzsTv0oa17+xg==}
|
||||
|
||||
/@babel/code-frame@7.22.5:
|
||||
resolution: {integrity: sha512-Xmwn266vad+6DAqEB2A6V/CcZVp62BbwVmcOJc2RPuwih1kw02TjQvWVWlcKGbBPd+8/0V5DEkOcizRGYsspYQ==}
|
||||
engines: {node: '>=6.9.0'}
|
||||
|
|
@ -5411,8 +5417,15 @@ packages:
|
|||
resolution: {integrity: sha512-DRQrD6gJyy8FbiE4s+bDoXS9hiW3Vbx5uCdwvcCf3zLHL+Iv7LtGHLpr+GZV8rHG8tK766FGYBwRbu8pELTt+w==}
|
||||
dev: true
|
||||
|
||||
/blurhash-as@0.10.0:
|
||||
resolution: {integrity: sha512-0xkq5uhvdQZfbytKAPtuy3vkkGdsZJxxqL3l6lWIgTIoEdH85jU/0HRENFDH5AW3MwChc6CnfXB4RUvvoRbJeA==}
|
||||
engines: {node: '>=10'}
|
||||
dependencies:
|
||||
'@assemblyscript/loader': 0.27.5
|
||||
|
||||
/blurhash@2.0.5:
|
||||
resolution: {integrity: sha512-cRygWd7kGBQO3VEhPiTgq4Wc43ctsM+o46urrmPOiuAe+07fzlSB9OJVdpgDL0jPqXUVQ9ht7aq7kxOeJHRK+w==}
|
||||
dev: true
|
||||
|
||||
/bmp-js@0.1.0:
|
||||
resolution: {integrity: sha512-vHdS19CnY3hwiNdkaqk93DvjVLfbEcI8mys4UjuWrlX1haDmroo8o4xCzh4wD6DGV6HxRCyauwhHRqMTfERtjw==}
|
||||
|
|
@ -17486,8 +17499,8 @@ packages:
|
|||
url-polyfill: 1.1.12
|
||||
dev: true
|
||||
|
||||
github.com/thatonecalculator/emojilib/1d6adc1af8105b4937d2f0e7479acf5bd565bd9b:
|
||||
resolution: {tarball: https://codeload.github.com/thatonecalculator/emojilib/tar.gz/1d6adc1af8105b4937d2f0e7479acf5bd565bd9b}
|
||||
github.com/thatonecalculator/emojilib/d3c8c6a77d4362b3b3180099f1d2eac344ce245c:
|
||||
resolution: {tarball: https://codeload.github.com/thatonecalculator/emojilib/tar.gz/d3c8c6a77d4362b3b3180099f1d2eac344ce245c}
|
||||
name: emojilib
|
||||
version: 3.0.10
|
||||
dev: true
|
||||
|
|
|
|||
Loading…
Reference in a new issue