diff --git a/docs/index.html b/docs/index.html
index 7278ba39d..97dbc16ce 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -23,9 +23,9 @@
             <div class="control">
                 <div class="header">
                     <div class="title">简单用法</div>
-                    <div class="run" data-id="1">运行</div>
+                    <div class="run">运行</div>
                 </div>
-                <div class="code" data-control="1"></div>
+                <div class="code"></div>
             </div>
         </div>
     </div>
diff --git a/docs/js/index.js b/docs/js/index.js
index 35c5a76b0..15b933891 100644
--- a/docs/js/index.js
+++ b/docs/js/index.js
@@ -1,39 +1,48 @@
-var controlMap = {};
-function creatCodeMirror(id, value) {
-    var mirror = CodeMirror(document.querySelector(`[data-control="${id}"]`), {
-        lineNumbers: true,
-        mode: 'javascript',
-        matchBrackets: true,
-        value: value.trim()
-    });
-    controlMap[Number(id)] = mirror;
-    return mirror;
+var mirror = CodeMirror(document.querySelector(`.code`), {
+    lineNumbers: true,
+    mode: 'javascript',
+    matchBrackets: true,
+    value: ''
+});;
+
+function creatCodeMirror(value) {
+    mirror.setValue(value.trim());
 }
 
 function initApp(app) {
-    console.log(app);
+    Artplayer.config.video.events.forEach(item => {
+        app.on('video:' + item, event => {
+            console.log('video: ' + event.type);
+        });
+    });
+}
+
+function timeTaken(callback) {
+    console.time('timeTaken');
+    const r = callback();
+    console.timeEnd('timeTaken');
+    return r;
 }
 
 var $error = document.querySelector('.error-tip');
-Array.from(document.querySelectorAll('.run')).forEach(function (item) {
-    item.addEventListener('click', function (e) {
-        try {
-            Artplayer.instances.forEach(ins => {
-                ins.destroy(true)
-            });;
-            var id = Number(e.target.dataset.id);
-            eval(controlMap[id].getValue());
-            initApp(Artplayer.instances[0]);
-            $error.innerHTML = '';
-        } catch (error) {
-            var msg = error.message.trim();
-            $error.innerHTML = '请打开控制台：' + msg;
-            console.error(msg);
-        }
-    });
+document.querySelector('.run').addEventListener('click', function (e) {
+    try {
+        Artplayer.instances.forEach(ins => {
+            ins.destroy(true)
+        });;
+        timeTaken(function () {
+            eval(mirror.getValue());
+        });
+        initApp(Artplayer.instances[0]);
+        $error.innerHTML = '';
+    } catch (error) {
+        var msg = error.message.trim();
+        $error.innerHTML = '请打开控制台：' + msg;
+        console.error(msg);
+    }
 });
 
-creatCodeMirror(1, `
+creatCodeMirror(`
 new Artplayer({
     container: '.artplayer-app',
     url: 'https://blog.zhw-island.com/assets-cdn/video/one-more-time-one-more-chance-480p.mp4'