diff --git a/src/logcat/story.js b/src/logcat/story.js
index f19ea0a..b96cf9b 100644
--- a/src/logcat/story.js
+++ b/src/logcat/story.js
@@ -9,6 +9,7 @@ import randomItem from 'licia/randomItem'
 import { boolean, number, select, text, button } from '@storybook/addon-knobs'
 import LunaLogcat from './react'
 import logs from './logcat.json'
+import { useEffect, useRef } from 'react'
 
 const def = story(
   'logcat',
@@ -27,7 +28,9 @@ const def = story(
     let destroyed = false
 
     function append() {
-      logcat.append(randomItem(logs))
+      const log = randomItem(logs)
+      log.date = new Date()
+      logcat.append(log)
       if (destroyed) {
         return
       }
@@ -49,6 +52,26 @@ const def = story(
     story: __STORY__,
     ReactComponent() {
       const { wrapLongLines, maxNum, filter, view } = createKnobs()
+      const logcatRef = useRef(null)
+
+      useEffect(() => {
+        let destroyed = false
+
+        if (logcatRef.current) {
+          function append() {
+            const log = randomItem(logs)
+            log.date = new Date()
+            logcatRef.current.append(log)
+            if (destroyed) {
+              return
+            }
+            setTimeout(append, random(10, 100))
+          }
+          append()
+        }
+
+        return () => (destroyed = true)
+      }, [])
 
       return (
         <LunaLogcat
@@ -58,7 +81,7 @@ const def = story(
           filter={filter}
           view={view}
           onContextMenu={() => console.log('context menu')}
-          onCreate={(logcat) => each(logs, (log) => logcat.append(log))}
+          onCreate={(logcat) => (logcatRef.current = logcat)}
         />
       )
     },
diff --git a/src/shader-toy-player/vue.ts b/src/shader-toy-player/vue.ts
index ed8007e..94db718 100644
--- a/src/shader-toy-player/vue.ts
+++ b/src/shader-toy-player/vue.ts
@@ -1,4 +1,4 @@
-import { defineComponent, h, onBeforeMount, onMounted, shallowRef } from 'vue'
+import { defineComponent, h, onBeforeUnmount, onMounted, shallowRef } from 'vue'
 import ShaderToyPlayer from './index'
 
 const LunaShaderToyPlayer = defineComponent({
@@ -30,7 +30,7 @@ const LunaShaderToyPlayer = defineComponent({
       context.emit('create', shaderToyPlayer.value)
     })
 
-    onBeforeMount(() => {
+    onBeforeUnmount(() => {
       shaderToyPlayer.value?.destroy()
     })
 
diff --git a/src/share/story.js b/src/share/story.js
index 9106524..62c3800 100644
--- a/src/share/story.js
+++ b/src/share/story.js
@@ -92,6 +92,7 @@ export default function story(
       window.componentName = upperFirst(camelCase(`react-${name}`))
 
       ReactDOM.render(<ReactComponent theme={theme} />, container)
+      window.reactComponent = container
 
       updateBackground(theme)
 
@@ -110,7 +111,9 @@ export default function story(
       delete window.component
       window.componentName = upperFirst(camelCase(`vue-${name}`))
 
-      createApp(VueComponent({ theme })).mount(container)
+      const app = createApp(VueComponent({ theme }))
+      app.mount(container)
+      window.vueComponent = app
 
       updateBackground(theme)
 
@@ -175,6 +178,12 @@ function fixKnobs(name) {
       })
     }
     each(window.components, (component) => component.destroy())
+    if (window.reactComponent) {
+      ReactDOM.unmountComponentAtNode(window.reactComponent)
+    }
+    if (window.vueComponent) {
+      window.vueComponent.unmount()
+    }
   }
 }