diff --git a/server/MaaJSLoader b/server/MaaJSLoader
index ba3909d..3f60ed2 160000
--- a/server/MaaJSLoader
+++ b/server/MaaJSLoader
@@ -1 +1 @@
-Subproject commit ba3909d03946345c9b420431d960d39e62bd8faf
+Subproject commit 3f60ed24a82349d3e95a1fef6d4ed012b3558cb7
diff --git a/server/src/index.ts b/server/src/index.ts
index b1ac028..1f2f5a4 100644
--- a/server/src/index.ts
+++ b/server/src/index.ts
@@ -9,7 +9,12 @@ import os from 'os'
 import path from 'path'
 import sms from 'source-map-support'
 
-import { MaaController, MaaFrameworkLoader, MaaResource } from '../MaaJSLoader'
+import {
+  MaaController,
+  MaaFrameworkLoader,
+  MaaInstance,
+  MaaResource
+} from '../MaaJSLoader'
 import { MaaAdbControllerTypeEnum } from '../MaaJSLoader/src/framework/types'
 
 interface Config {
@@ -105,17 +110,84 @@ async function main() {
     })
   })
 
+  app.ws('/api/instance', async (ws, req) => {
+    if (!controller) {
+      ws.close()
+      return
+    }
+
+    const resource = await prepareResource()
+    if (!resource) {
+      ws.close()
+      return
+    }
+
+    const instance = new MaaInstance(loader, (msg, detail) => {
+      ws.send(
+        JSON.stringify({
+          type: 'callback',
+          msg,
+          detail
+        })
+      )
+    })
+
+    instance.bindController(controller)
+    instance.bindResource(resource)
+
+    if (!instance.inited()) {
+      ws.close()
+      resource.destroy()
+      return
+    }
+
+    ws.on('close', () => {
+      // instance.destroy()
+      resource.destroy()
+    })
+
+    ws.send(
+      JSON.stringify({
+        type: 'inited'
+      })
+    )
+
+    ws.on('message', async data => {
+      const action = JSON.parse(data.toString('utf-8')) as {
+        action: 'start'
+        task: string[]
+      }
+      if (controller) {
+        switch (action.action) {
+          case 'start': {
+            for (const task of action.task) {
+              instance.post(task, {}, status => {
+                ws.send(
+                  JSON.stringify({
+                    type: 'status',
+                    task,
+                    status
+                  })
+                )
+              })
+            }
+          }
+        }
+      }
+    })
+  })
+
   app.listen(config.port, () => {
     console.log(`server started: http://localhost:${config.port}/`)
   })
 
-  loader = new MaaFrameworkLoader()
-  loader.load(path.join(config.maaframework.root, 'bin'))
+  if (config.maaframework.emulator) {
+    loader = new MaaFrameworkLoader()
+    loader.load(path.join(config.maaframework.root, 'bin'))
 
-  loader.setLogging(config.maaframework.log)
-  loader.setDebugMode(config.maaframework.debug)
+    loader.setLogging(config.maaframework.log)
+    loader.setDebugMode(config.maaframework.debug)
 
-  if (config.maaframework.emulator) {
     const ctrl = await prepareController()
     if (ctrl) {
       controller = ctrl
diff --git a/src/App.vue b/src/App.vue
index a740571..3ecd6fc 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,5 +1,28 @@
 <script setup lang="ts">
+import { onMounted } from 'vue'
 import { RouterView } from 'vue-router'
+
+import { fs } from '@/filesystem'
+import { loadFS } from '@/loader'
+
+onMounted(async () => {
+  await loadFS()
+  window.onkeydown = ev => {
+    if (ev.ctrlKey && (ev.key === 'z' || ev.key === 'Z')) {
+      ev.stopPropagation()
+      ev.preventDefault()
+      if (ev.shiftKey) {
+        if (fs.history.canRedo.value) {
+          fs.history.redo()
+        }
+      } else {
+        if (fs.history.canUndo.value) {
+          fs.history.undo()
+        }
+      }
+    }
+  }
+})
 </script>
 
 <template>
diff --git a/src/api.ts b/src/api.ts
index d927eda..c1664f4 100644
--- a/src/api.ts
+++ b/src/api.ts
@@ -26,3 +26,12 @@ export async function controller() {
     }
   })
 }
+
+export async function instance() {
+  return new Promise<WebSocket>(resolve => {
+    const ws = new WebSocket('ws://' + window.location.host + '/api/instance')
+    ws.onopen = () => {
+      resolve(ws)
+    }
+  })
+}
diff --git a/src/components/atomic/ClearButton.vue b/src/components/atomic/ClearButton.vue
index 884c80c..ed4b3ed 100644
--- a/src/components/atomic/ClearButton.vue
+++ b/src/components/atomic/ClearButton.vue
@@ -30,7 +30,7 @@ function clean() {
 </script>
 
 <template>
-  <NPopover trigger="hover">
+  <NPopover trigger="hover" :disabled="!propkey">
     <template #trigger>
       <NButton
         secondary
diff --git a/src/components/task/SingleNavigateEdit.vue b/src/components/task/SingleNavigateEdit.vue
index 17ec74d..abce04a 100644
--- a/src/components/task/SingleNavigateEdit.vue
+++ b/src/components/task/SingleNavigateEdit.vue
@@ -58,7 +58,7 @@ const options = computed(() => {
 </script>
 
 <template>
-  <div class="flex gap-2">
+  <div class="flex gap-2 w-full">
     <NButton
       :disabled="!(value in taskIndex)"
       @click="navigate(taskIndex[value])"
diff --git a/src/layout/MainLayout.vue b/src/layout/MainLayout.vue
new file mode 100644
index 0000000..d49fb50
--- /dev/null
+++ b/src/layout/MainLayout.vue
@@ -0,0 +1,10 @@
+<template>
+  <div class="flex flex-col gap-2 flex-1 min-h-0">
+    <div class="flex gap-2">
+      <slot name="action"></slot>
+    </div>
+    <div class="flex gap-2 flex-1 min-h-0">
+      <slot></slot>
+    </div>
+  </div>
+</template>
diff --git a/src/router/index.ts b/src/router/index.ts
index a7d58ba..74ec3b3 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -1,6 +1,7 @@
 import { createRouter, createWebHistory } from 'vue-router'
 
 import EditView from '@/views/EditView.vue'
+import EvalView from '@/views/EvalView.vue'
 
 const router = createRouter({
   history: createWebHistory(),
@@ -12,6 +13,10 @@ const router = createRouter({
     {
       path: '/edit',
       component: EditView
+    },
+    {
+      path: '/eval',
+      component: EvalView
     }
   ]
 })
diff --git a/src/types.ts b/src/types.ts
index 9d451aa..964c1d7 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -156,3 +156,18 @@ export type Task = Recognition &
 export interface TaskData {
   [task: string]: Task
 }
+
+export interface TaskRunInfo {
+  task: string
+  enable: boolean
+  status: 'skipped' | 'pending' | 'running' | 'success' | 'error'
+}
+
+export const enum DispatcherStatus {
+  Invalid,
+  Pending,
+  Started,
+  Completed,
+  Failed,
+  Stopped
+}
diff --git a/src/views/EditView.vue b/src/views/EditView.vue
index 4314796..a6cc212 100644
--- a/src/views/EditView.vue
+++ b/src/views/EditView.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import {
+  BuildOutlined,
   FileDownloadOutlined,
   FileUploadOutlined,
   NavigateBeforeOutlined,
@@ -8,7 +9,8 @@ import {
   UndoOutlined
 } from '@vicons/material'
 import { NButton, NCard, NIcon } from 'naive-ui'
-import { onMounted, ref } from 'vue'
+import { ref } from 'vue'
+import { useRouter } from 'vue-router'
 
 import { active, getTask, history, setTask } from '@/data'
 import { type PathKey, fs } from '@/filesystem'
@@ -16,32 +18,23 @@ import { loadFS, saveFS } from '@/loader'
 
 import TaskEdit from '@/components/TaskEdit.vue'
 import TaskTree from '@/components/TaskTree.vue'
+import MainLayout from '@/layout/MainLayout.vue'
 
-const expands = ref<PathKey[]>(['/' as PathKey])
+const router = useRouter()
 
-onMounted(async () => {
-  await loadFS()
-  window.onkeydown = ev => {
-    if (ev.ctrlKey && (ev.key === 'z' || ev.key === 'Z')) {
-      ev.stopPropagation()
-      ev.preventDefault()
-      if (ev.shiftKey) {
-        if (fs.history.canRedo.value) {
-          fs.history.redo()
-        }
-      } else {
-        if (fs.history.canUndo.value) {
-          fs.history.undo()
-        }
-      }
-    }
-  }
-})
+const expands = ref<PathKey[]>(['/' as PathKey])
 </script>
 
 <template>
-  <div class="flex flex-col gap-2 flex-1 min-h-0">
-    <div class="flex gap-2">
+  <MainLayout>
+    <template #action>
+      <NButton @click="router.push('/eval')">
+        <template #icon>
+          <NIcon>
+            <BuildOutlined></BuildOutlined>
+          </NIcon>
+        </template>
+      </NButton>
       <NButton :disabled="!fs.history.canUndo.value" @click="fs.history.undo">
         <template #icon>
           <NIcon>
@@ -90,28 +83,26 @@ onMounted(async () => {
           </NIcon>
         </template>
       </NButton>
-    </div>
-    <div class="flex gap-2 flex-1 min-h-0">
-      <NCard
-        class="min-h-0"
-        style="max-width: 400px"
-        content-style="max-height: 100%; display: flex; flex-direction: column"
-      >
-        <TaskTree v-model:expand="expands"></TaskTree>
-      </NCard>
-      <NCard class="min-h-0" content-style="max-height: 100%">
-        <template v-if="active && getTask(active)">
-          <TaskEdit
-            :name="active"
-            :value="getTask(active)!"
-            @update:value="
-              task => {
-                setTask(active!, task)
-              }
-            "
-          ></TaskEdit>
-        </template>
-      </NCard>
-    </div>
-  </div>
+    </template>
+    <NCard
+      class="min-h-0"
+      style="max-width: 400px"
+      content-style="max-height: 100%; display: flex; flex-direction: column"
+    >
+      <TaskTree v-model:expand="expands"></TaskTree>
+    </NCard>
+    <NCard class="min-h-0" content-style="max-height: 100%">
+      <template v-if="active && getTask(active)">
+        <TaskEdit
+          :name="active"
+          :value="getTask(active)!"
+          @update:value="
+            task => {
+              setTask(active!, task)
+            }
+          "
+        ></TaskEdit>
+      </template>
+    </NCard>
+  </MainLayout>
 </template>
diff --git a/src/views/EvalView.vue b/src/views/EvalView.vue
new file mode 100644
index 0000000..97b5d67
--- /dev/null
+++ b/src/views/EvalView.vue
@@ -0,0 +1,171 @@
+<script setup lang="ts">
+import {
+  ChangeCircleOutlined,
+  CheckOutlined,
+  CloseOutlined,
+  EditOutlined,
+  PendingOutlined,
+  PlayArrowOutlined
+} from '@vicons/material'
+import { NButton, NCard, NCheckbox, NIcon } from 'naive-ui'
+import { ref } from 'vue'
+import { useRouter } from 'vue-router'
+
+import * as api from '@/api'
+import { taskIndex } from '@/data'
+import { DispatcherStatus, type TaskRunInfo } from '@/types'
+
+import ArrayEdit from '@/components/array/ArrayEdit.vue'
+import ClearButton from '@/components/atomic/ClearButton.vue'
+import SingleNavigateEdit from '@/components/task/SingleNavigateEdit.vue'
+import FormLayout from '@/layout/FormLayout.vue'
+import MainLayout from '@/layout/MainLayout.vue'
+
+const router = useRouter()
+const runInfo = ref<TaskRunInfo[]>([])
+
+let instance: WebSocket
+let inited = false
+
+function translateStatus(status: DispatcherStatus) {
+  switch (status) {
+    case DispatcherStatus.Invalid:
+      return 'skipped'
+    case DispatcherStatus.Pending:
+      return 'pending'
+    case DispatcherStatus.Started:
+      return 'running'
+    case DispatcherStatus.Completed:
+      return 'success'
+    case DispatcherStatus.Failed:
+      return 'error'
+    case DispatcherStatus.Stopped:
+      return 'skipped'
+  }
+}
+
+async function tryStart() {
+  if (!instance) {
+    instance = await api.instance()
+    instance.onmessage = ev => {
+      const obj = JSON.parse(ev.data) as {
+        type: 'inited' | 'callback' | 'status'
+        msg: string
+        detail: string
+        task: string
+        status: DispatcherStatus
+      }
+      switch (obj.type) {
+        case 'inited':
+          inited = true
+          break
+        case 'callback':
+          console.log(obj.msg, JSON.parse(obj.detail))
+          break
+        case 'status': {
+          const idx = runInfo.value.findIndex(x => x.task === obj.task)
+          if (idx !== -1) {
+            runInfo.value[idx].status = translateStatus(obj.status)
+          }
+          break
+        }
+      }
+    }
+  }
+  if (inited) {
+    instance.send(
+      JSON.stringify({
+        action: 'start',
+        task: runInfo.value
+          .filter(x => x.enable && x.task in taskIndex.value)
+          .map(x => x.task)
+      })
+    )
+  }
+}
+</script>
+
+<template>
+  <MainLayout>
+    <template #action>
+      <NButton @click="router.push('/edit')">
+        <template #icon>
+          <NIcon>
+            <EditOutlined></EditOutlined>
+          </NIcon>
+        </template>
+      </NButton>
+      <NButton @click="tryStart">
+        <template #icon>
+          <NIcon>
+            <PlayArrowOutlined></PlayArrowOutlined>
+          </NIcon>
+        </template>
+      </NButton>
+    </template>
+
+    <NCard>
+      <div class="flex items-start">
+        <FormLayout>
+          <ClearButton propkey="" :value="null"> 任务列表 </ClearButton>
+          <ArrayEdit
+            v-model:value="runInfo"
+            type="multi"
+            :nullable="true"
+            :def="() => ({ task: '', enable: true, status: 'skipped' })"
+            :is-t="v => !(v instanceof Array)"
+          >
+            <template #edit="{ value, update }">
+              <div class="flex gap-2 items-center">
+                <NCheckbox
+                  :checked="value.enable"
+                  @update:checked="
+                    v => {
+                      update({
+                        ...value,
+                        enable: v
+                      })
+                    }
+                  "
+                ></NCheckbox>
+                <NButton :disabled="value.status === 'skipped'" text>
+                  <!-- 'skipped' | 'pending' | 'running' | 'success' | 'error' -->
+                  <template #icon>
+                    <NIcon>
+                      <PendingOutlined
+                        v-if="
+                          value.status === 'skipped' ||
+                          value.status === 'pending'
+                        "
+                      ></PendingOutlined>
+                      <ChangeCircleOutlined
+                        v-else-if="value.status === 'running'"
+                      ></ChangeCircleOutlined>
+                      <CheckOutlined
+                        v-else-if="value.status === 'success'"
+                      ></CheckOutlined>
+                      <CloseOutlined
+                        v-else-if="value.status === 'error'"
+                      ></CloseOutlined>
+                    </NIcon>
+                  </template>
+                </NButton>
+                <SingleNavigateEdit
+                  :value="value.task"
+                  @update:value="
+                    v => {
+                      update({
+                        ...value,
+                        task: v
+                      })
+                    }
+                  "
+                ></SingleNavigateEdit>
+              </div>
+            </template>
+          </ArrayEdit>
+        </FormLayout>
+      </div>
+    </NCard>
+  </MainLayout>
+</template>