perf(frontend): MkImgWithBlurhashでblurhash描画に使うcanvasは再利用するようにする (#10966)

* blurhashを描画するためのcanvasは再利用する

* Revert "perf(frontend): WebGL contextの数を減らす"

This reverts commit aeb8955ca2600e801d44dcac2005fc994e665a6c.

* MkAvatarは平均色だけにする

* clean up

* fix

1 files changed, 5 insertions, 3 deletions

diff --git a/packages/frontend/src/workers/draw-blurhash.ts b/packages/frontend/src/workers/draw-blurhash.ts
index 5f2168a44a..e0672d5424 100644
--- a/packages/frontend/src/workers/draw-blurhash.ts
+++ b/packages/frontend/src/workers/draw-blurhash.ts
@@ -1,5 +1,7 @@
 import { render } from 'buraha';
 
+const canvas = new OffscreenCanvas(64, 64);
+
 onmessage = (event) => {
     // console.log(event.data);
     if (!('id' in event.data && typeof event.data.id === 'string')) {
@@ -8,8 +10,8 @@ onmessage = (event) => {
     if (!('hash' in event.data && typeof event.data.hash === 'string')) {
         return;
     }
-    const work = new OffscreenCanvas(event.data.width ?? 64, event.data.height ?? 64);
-    render(event.data.hash, work);
-    const bitmap = work.transferToImageBitmap();
+
+    render(event.data.hash, canvas);
+    const bitmap = canvas.transferToImageBitmap();
     postMessage({ id: event.data.id, bitmap });
 };