diff --git a/package.json b/package.json
index 722ec35..8465bdb 100644
--- a/package.json
+++ b/package.json
@@ -16,6 +16,7 @@
     "@iconify-json/mdi": "^1.1.66",
     "@types/canvas-confetti": "^1.6.4",
     "@types/lodash-es": "^4.17.12",
+    "@types/node": "^20.12.7",
     "solid-devtools": "^0.29.3",
     "typescript": "^5.4.5",
     "unocss": "^0.59.2",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index a629ed8..b480f32 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -57,6 +57,9 @@ devDependencies:
   '@types/lodash-es':
     specifier: ^4.17.12
     version: 4.17.12
+  '@types/node':
+    specifier: ^20.12.7
+    version: 20.12.7
   solid-devtools:
     specifier: ^0.29.3
     version: 0.29.3(solid-js@1.8.16)(vite@5.2.8)
@@ -68,7 +71,7 @@ devDependencies:
     version: 0.59.2(postcss@8.4.38)(vite@5.2.8)
   vite:
     specifier: ^5.2.8
-    version: 5.2.8(sass@1.75.0)
+    version: 5.2.8(@types/node@20.12.7)(sass@1.75.0)
   vite-plugin-solid:
     specifier: ^2.10.2
     version: 2.10.2(solid-js@1.8.16)(vite@5.2.8)
@@ -1156,6 +1159,12 @@ packages:
     resolution: {integrity: sha512-t7dhREVv6dbNj0q17X12j7yDG4bD/DHYX7o5/DbDxobP0HnGPgpRz2Ej77aL7TZT3DSw13fqUTj8J4mMnqa7WA==}
     dev: true
 
+  /@types/node@20.12.7:
+    resolution: {integrity: sha512-wq0cICSkRLVaf3UGLMGItu/PtdY7oaXaI/RVU+xliKVOtRna3PRY57ZDfztpDL0n11vfymMUnXv8QwYCO7L1wg==}
+    dependencies:
+      undici-types: 5.26.5
+    dev: true
+
   /@unocss/astro@0.59.2(vite@5.2.8):
     resolution: {integrity: sha512-vchGjdGxwDELAWJX6Ql5FCg+eDsJmT4Pn752h4oCy6cZHq/0i4p+CovT/Rb8AkfCpCW+DtdjKRRhfAnmKjJquQ==}
     peerDependencies:
@@ -1167,7 +1176,7 @@ packages:
       '@unocss/core': 0.59.2
       '@unocss/reset': 0.59.2
       '@unocss/vite': 0.59.2(vite@5.2.8)
-      vite: 5.2.8(sass@1.75.0)
+      vite: 5.2.8(@types/node@20.12.7)(sass@1.75.0)
     transitivePeerDependencies:
       - rollup
     dev: true
@@ -1365,7 +1374,7 @@ packages:
       chokidar: 3.6.0
       fast-glob: 3.3.2
       magic-string: 0.30.9
-      vite: 5.2.8(sass@1.75.0)
+      vite: 5.2.8(@types/node@20.12.7)(sass@1.75.0)
     transitivePeerDependencies:
       - rollup
     dev: true
@@ -2055,7 +2064,7 @@ packages:
       '@solid-devtools/debugger': 0.23.4(solid-js@1.8.16)
       '@solid-devtools/shared': 0.13.2(solid-js@1.8.16)
       solid-js: 1.8.16
-      vite: 5.2.8(sass@1.75.0)
+      vite: 5.2.8(@types/node@20.12.7)(sass@1.75.0)
     transitivePeerDependencies:
       - supports-color
     dev: true
@@ -2129,6 +2138,10 @@ packages:
       mlly: 1.6.1
     dev: true
 
+  /undici-types@5.26.5:
+    resolution: {integrity: sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==}
+    dev: true
+
   /unocss@0.59.2(postcss@8.4.38)(vite@5.2.8):
     resolution: {integrity: sha512-9puB1L+VxpCAgeidkd67otmA0pbqNPxBPT/8l6gncF0i2RE0WkKITlMflP0PhLNpOdHUfUWb9Cdj1aVnjRnXFA==}
     engines: {node: '>=14'}
@@ -2161,7 +2174,7 @@ packages:
       '@unocss/transformer-directives': 0.59.2
       '@unocss/transformer-variant-group': 0.59.2
       '@unocss/vite': 0.59.2(vite@5.2.8)
-      vite: 5.2.8(sass@1.75.0)
+      vite: 5.2.8(@types/node@20.12.7)(sass@1.75.0)
     transitivePeerDependencies:
       - postcss
       - rollup
@@ -2199,13 +2212,13 @@ packages:
       merge-anything: 5.1.7
       solid-js: 1.8.16
       solid-refresh: 0.6.3(solid-js@1.8.16)
-      vite: 5.2.8(sass@1.75.0)
+      vite: 5.2.8(@types/node@20.12.7)(sass@1.75.0)
       vitefu: 0.2.5(vite@5.2.8)
     transitivePeerDependencies:
       - supports-color
     dev: true
 
-  /vite@5.2.8(sass@1.75.0):
+  /vite@5.2.8(@types/node@20.12.7)(sass@1.75.0):
     resolution: {integrity: sha512-OyZR+c1CE8yeHw5V5t59aXsUPPVTHMDjEZz8MgguLL/Q7NblxhZUlTu9xSPqlsUO/y+X7dlU05jdhvyycD55DA==}
     engines: {node: ^18.0.0 || >=20.0.0}
     hasBin: true
@@ -2233,6 +2246,7 @@ packages:
       terser:
         optional: true
     dependencies:
+      '@types/node': 20.12.7
       esbuild: 0.20.2
       postcss: 8.4.38
       rollup: 4.14.2
@@ -2249,7 +2263,7 @@ packages:
       vite:
         optional: true
     dependencies:
-      vite: 5.2.8(sass@1.75.0)
+      vite: 5.2.8(@types/node@20.12.7)(sass@1.75.0)
     dev: true
 
   /which@2.0.2:
diff --git a/src/components/OptionEditor.tsx b/src/components/OptionEditor.tsx
index 767f159..7e6bc0b 100644
--- a/src/components/OptionEditor.tsx
+++ b/src/components/OptionEditor.tsx
@@ -127,9 +127,9 @@ export function OptionEditor() {
       <video
         ref={x => (videoEl = x)}
         src={store.fileInfo.url}
-        class="w-full h-64 outline-0 rounded-t-xl"
+        class="optionEditor-video w-full h-64 outline-0 rounded-t-xl"
         classList={{'outline-2 outline-solid outline-yellow outline-offset--2': previewingSpeed()}}
-        controls
+        controls muted
         onfocus={() => setPreviewingSpeed(false)}
         ontimeupdate={x => setVideoTime(x.currentTarget.currentTime)}
       />
diff --git a/src/components/OutputDisplay.tsx b/src/components/OutputDisplay.tsx
index 8cc913e..5a4e6a4 100644
--- a/src/components/OutputDisplay.tsx
+++ b/src/components/OutputDisplay.tsx
@@ -1,4 +1,4 @@
-import { Show, createSignal } from "solid-js";
+import { Show, createMemo, createSignal } from "solid-js";
 import { store } from "../store";
 import confetti from 'canvas-confetti';
 
@@ -23,13 +23,43 @@ function playConfetti(el: HTMLElement) {
 
 export function OutputDisplay() {
   const [showDonate, setShowDonate] = createSignal(false)
+  const hasError = createMemo(() => isNaN(store.outputFileContent?.length || 0))
 
   return <Show when={store.outputFileURL}>
     <section
-      class="bg-slate-2 rounded-xl p-4 mt-4 animate-zoom-in animate-duration-300 animate-ease-out"
+      class="rounded-xl p-4 mt-4 animate-zoom-in animate-duration-300 animate-ease-out"
+      classList={{ 'bg-gray-1': hasError(), 'bg-slate-2': !hasError() }}
       ref={e => setTimeout(() => playConfetti(e!), 50)}
     >
       <h2>Output</h2>
+
+      <Show when={hasError()}>
+        <div class="bg-white p-4 rounded-xl mb-4">
+          <div class="">
+            <i class="i-mdi-emoticon-sad-outline text-xl mr-2" />
+            Am I messed it up?
+
+            <button class="rounded ml-4 p-4 py-2 bg-blue-6 text-white cursor-pointer" onClick={() => {
+              const title = `Failed to convert: ${store.fileInfo.extname}`
+              const body = [
+                '<!-- if possible, please provide the video file 🫴🎬 to analyze and solve bug🔬. -->',
+                '<!-- (sample files are public, please consider carefully) -->',
+                '',
+                `- File: ${store.fileInfo.extname}  (${readableFileSize(store.fileContent?.byteLength || 0)})` ,
+                `- User-Agent: ${navigator.userAgent}`,
+                `- File Info: \`${JSON.stringify(store.fileInfo)}\``,
+                `- Options: \`${JSON.stringify(store.options)}\``,
+                `- Git Revision: ${GIT_REVISION}`,
+                `- Source: ${location.href}`,
+              ].join('\n')
+              window.open(`https://github.com/lyonbot/video-to-gif/issues/new?title=${encodeURIComponent(title)}&body=${encodeURIComponent(body)}`, 'tweetShare')
+            }}>
+              <i class="i-mdi-flag"></i> Report an Issue
+            </button>
+          </div>
+        </div>
+      </Show>
+
       <p>File size: {readableFileSize(store.outputFileContent?.length || 0)}</p>
       <p>
         <a
diff --git a/src/components/Processing.tsx b/src/components/Processing.tsx
index 521571b..dcca584 100644
--- a/src/components/Processing.tsx
+++ b/src/components/Processing.tsx
@@ -1,4 +1,4 @@
-import { Show, createEffect, createRoot, createSignal } from "solid-js";
+import { Show, createEffect, createMemo, createRoot, createSignal } from "solid-js";
 import { encode as GIFEncode } from 'modern-gif'
 import GIFWorkerJS from 'modern-gif/worker?url'
 import { outputSize, outputTimeRange, store, updateStore } from "../store";
@@ -13,6 +13,13 @@ export function ProcessingBar() {
   let [percentage, setPercentage] = createSignal(0);
   let [errorMessage, setErrorMessage] = createSignal('');
 
+  const errorHint = createMemo(() => {
+    const msg = errorMessage()
+    if (!msg) return null
+
+    if (/allocation failed/.test(msg)) return "Please reduce the width / height / framerate / duration, and try again"
+  })
+
   let [isUseFFMpeg, setIsUseFFMpeg] = createSignal(true);
 
   async function processWithGIFjs() {
@@ -230,7 +237,8 @@ export function ProcessingBar() {
       return;
     }
 
-    setIsRunning(true)
+    setIsRunning(true);
+    (document.querySelector('video.optionEditor-video') as HTMLVideoElement)?.pause()
     setErrorMessage('')
     console.time('process')
 
@@ -297,6 +305,12 @@ export function ProcessingBar() {
       <div class="text-center my-4 text-red-7">
         <i class="i-mdi-alert-circle"></i> {errorMessage()}
       </div>
+
+      <Show when={errorHint()}>
+        <div class="text-center my-4 mt--2 text-orange">
+          {errorHint()}
+        </div>
+      </Show>
     </Show>
 
     <Show when={isRunning()}>
diff --git a/src/report.ts b/src/report.ts
index 8419a4c..adc5b18 100644
--- a/src/report.ts
+++ b/src/report.ts
@@ -4,6 +4,7 @@ export function setupSentry() {
   if (import.meta.env.DEV) return;
   Sentry.init({
     dsn: 'https://0c8214d0263fb84bbe9de352b663ddf3@o4507088476766208.ingest.us.sentry.io/4507088478404608',
+    release: GIT_REVISION,
   });
 }
 
diff --git a/src/types/shim.d.ts b/src/types/shim.d.ts
index 8b0296d..6d8c2ac 100644
--- a/src/types/shim.d.ts
+++ b/src/types/shim.d.ts
@@ -2,4 +2,6 @@ declare class ImageCapture {
   constructor(videoTrack: MediaStreamTrack);
   track: MediaStreamTrack
   grabFrame(): Promise<ImageBitmap>
-}
\ No newline at end of file
+}
+
+declare const GIT_REVISION: string;
diff --git a/vite.config.ts b/vite.config.ts
index db9f5a6..d2d7ff2 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -1,8 +1,12 @@
+import childProcess from 'node:child_process';
 import { defineConfig } from 'vite';
 import solidPlugin from 'vite-plugin-solid';
 import devtools from 'solid-devtools/vite';
 import UnoCSS from 'unocss/vite';
 
+let GIT_REVISION = 'unknown'
+try { GIT_REVISION = childProcess.execSync("git rev-parse HEAD").toString().trim() } catch { }
+
 export default defineConfig({
   plugins: [
     UnoCSS(),
@@ -20,4 +24,7 @@ export default defineConfig({
   build: {
     target: 'esnext',
   },
+  define: {
+    GIT_REVISION: JSON.stringify(GIT_REVISION)
+  }
 });