diff --git a/src/components/avatar.jsx b/src/components/avatar.jsx
index 1a9fd40e..0edc9d3b 100644
--- a/src/components/avatar.jsx
+++ b/src/components/avatar.jsx
@@ -62,29 +62,32 @@ function Avatar({ url, size, alt = '', squircle, ...props }) {
             if (avatarRef.current) avatarRef.current.dataset.loaded = true;
             if (alphaCache[url] !== undefined) return;
             if (isMissing) return;
-            try {
-              // Check if image has alpha channel
-              const { width, height } = e.target;
-              if (canvas.width !== width) canvas.width = width;
-              if (canvas.height !== height) canvas.height = height;
-              ctx.drawImage(e.target, 0, 0);
-              const allPixels = ctx.getImageData(0, 0, width, height);
-              // At least 10% of pixels have alpha <= 128
-              const hasAlpha =
-                allPixels.data.filter((pixel, i) => i % 4 === 3 && pixel <= 128)
-                  .length /
-                  (allPixels.data.length / 4) >
-                0.1;
-              if (hasAlpha) {
-                // console.log('hasAlpha', hasAlpha, allPixels.data);
-                avatarRef.current.classList.add('has-alpha');
+            queueMicrotask(() => {
+              try {
+                // Check if image has alpha channel
+                const { width, height } = e.target;
+                if (canvas.width !== width) canvas.width = width;
+                if (canvas.height !== height) canvas.height = height;
+                ctx.drawImage(e.target, 0, 0);
+                const allPixels = ctx.getImageData(0, 0, width, height);
+                // At least 10% of pixels have alpha <= 128
+                const hasAlpha =
+                  allPixels.data.filter(
+                    (pixel, i) => i % 4 === 3 && pixel <= 128,
+                  ).length /
+                    (allPixels.data.length / 4) >
+                  0.1;
+                if (hasAlpha) {
+                  // console.log('hasAlpha', hasAlpha, allPixels.data);
+                  avatarRef.current.classList.add('has-alpha');
+                }
+                alphaCache[url] = hasAlpha;
+                ctx.clearRect(0, 0, width, height);
+              } catch (e) {
+                // Silent fail
+                alphaCache[url] = false;
               }
-              alphaCache[url] = hasAlpha;
-              ctx.clearRect(0, 0, width, height);
-            } catch (e) {
-              // Silent fail
-              alphaCache[url] = false;
-            }
+            });
           }}
         />
       )}