fix(eslint): reduce warnings in GitHub Actions deployment

- Disable formatting rules (handled by Prettier)
- Relaxed strict Vue/JS rules for demo code compatibility
- Fix syntax errors in ApiPlayground and VoiceCloningDemo
- Fix duplicate else-if condition in ApiPlayground
- Fix Promise executor async pattern in AutoregressiveAudioDemo
- Add TypeScript file support to ESLint config

Warnings reduced from 295 to 251 problems.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

docs/.vitepress/theme/components/appendix/concurrency-models/AsyncAwaitDemo.vue

@@ -3,11 +3,26 @@
     <h4>async/await 机制演示</h4>
 
     <div class="controls">
-      <el-button type="primary" size="small" @click="runExample" :disabled="isRunning">
+      <el-button
+        type="primary"
+        size="small"
+        :disabled="isRunning"
+        @click="runExample"
+      >
         {{ isRunning ? '运行中...' : '运行示例' }}
       </el-button>
-      <el-button size="small" @click="reset">重置</el-button>
-      <el-checkbox v-model="showDetails" size="small">显示详细信息</el-checkbox>
+      <el-button
+        size="small"
+        @click="reset"
+      >
+        重置
+      </el-button>
+      <el-checkbox
+        v-model="showDetails"
+        size="small"
+      >
+        显示详细信息
+      </el-checkbox>
     </div>
 
     <div class="code-section">
@@ -35,31 +50,60 @@
         <h5>执行时间线</h5>
         <div class="timeline">
           <div class="time-axis">
-            <div class="axis-label">0ms</div>
-            <div class="axis-label">50ms</div>
-            <div class="axis-label">100ms</div>
-            <div class="axis-label">150ms</div>
-            <div class="axis-label">200ms</div>
+            <div class="axis-label">
+              0ms
+            </div>
+            <div class="axis-label">
+              50ms
+            </div>
+            <div class="axis-label">
+              100ms
+            </div>
+            <div class="axis-label">
+              150ms
+            </div>
+            <div class="axis-label">
+              200ms
+            </div>
           </div>
 
           <div class="thread-rows">
             <div class="thread-row">
-              <div class="row-label">事件循环</div>
+              <div class="row-label">
+                事件循环
+              </div>
               <div class="row-track">
-                <div class="execution-segment event-loop" style="width: 100%;">
+                <div
+                  class="execution-segment event-loop"
+                  style="width: 100%;"
+                >
                   调度中
                 </div>
               </div>
             </div>
 
-            <div v-for="(task, idx) in tasks" :key="task.id" class="thread-row">
-              <div class="row-label">任务 {{ task.id }}</div>
+            <div
+              v-for="(task, idx) in tasks"
+              :key="task.id"
+              class="thread-row"
+            >
+              <div class="row-label">
+                任务 {{ task.id }}
+              </div>
               <div class="row-track">
-                <template v-for="(segment, sidx) in task.segments" :key="sidx">
-                  <div class="execution-segment"
+                <template
+                  v-for="(segment, sidx) in task.segments"
+                  :key="sidx"
+                >
+                  <div
+                    class="execution-segment"
                     :class="{ 'active': segment.type === 'active', 'io': segment.type === 'io' }"
-                    :style="{ left: segment.start + '%', width: segment.width + '%', backgroundColor: segment.color }">
-                    <span v-if="segment.width > 8" class="segment-label">
+                    :style="{ left: segment.start + '%', width: segment.width + '%', backgroundColor: segment.color }"
+                  >
+                    <span
+                      v-if="segment.width > 8"
+                      class="segment-label"
+                    >
                       {{ segment.type === 'active' ? '执行' : 'I/O' }}
                     </span>
                   </div>
@@ -72,28 +116,48 @@
 
       <div class="stats-grid">
         <div class="stat-card">
-          <div class="stat-title">并发任务数</div>
-          <div class="stat-value">{{ tasks.length }}</div>
+          <div class="stat-title">
+            并发任务数
+          </div>
+          <div class="stat-value">
+            {{ tasks.length }}
+          </div>
         </div>
         <div class="stat-card">
-          <div class="stat-title">总执行时间</div>
-          <div class="stat-value">{{ totalTime }}ms</div>
+          <div class="stat-title">
+            总执行时间
+          </div>
+          <div class="stat-value">
+            {{ totalTime }}ms
+          </div>
         </div>
         <div class="stat-card">
-          <div class="stat-title">I/O 等待时间</div>
-          <div class="stat-value">{{ ioWaitTime }}ms</div>
+          <div class="stat-title">
+            I/O 等待时间
+          </div>
+          <div class="stat-value">
+            {{ ioWaitTime }}ms
+          </div>
         </div>
         <div class="stat-card">
-          <div class="stat-title">CPU 利用率</div>
-          <div class="stat-value">{{ cpuUtilization }}%</div>
+          <div class="stat-title">
+            CPU 利用率
+          </div>
+          <div class="stat-value">
+            {{ cpuUtilization }}%
+          </div>
         </div>
       </div>
     </div>
 
     <div class="explanation">
-      <el-alert title="async/await 的优势" type="success"
+      <el-alert
+        title="async/await 的优势"
+        type="success"
         description="当一个任务遇到 I/O 操作(如网络请求)时，await 会让出 CPU，事件循环调度其他任务执行。I/O 完成后，任务从断点恢复。这种方式让单个线程可以并发处理数千个任务。"
-        show-icon :closable="false" />
+        show-icon
+        :closable="false"
+      />
     </div>
   </div>
 </template>

docs/.vitepress/theme/components/appendix/concurrency-models/ConcurrentVsParallelDemo.vue

@@ -3,20 +3,46 @@
     <h4>并发 (Concurrency) vs 并行 (Parallelism) 演示</h4>
 
     <div class="controls">
-      <el-radio-group v-model="demoMode" size="small">
-        <el-radio-button label="concurrent">单核并发</el-radio-button>
-        <el-radio-button label="parallel">多核并行</el-radio-button>
-        <el-radio-button label="hybrid">混合模式</el-radio-button>
+      <el-radio-group
+        v-model="demoMode"
+        size="small"
+      >
+        <el-radio-button label="concurrent">
+          单核并发
+        </el-radio-button>
+        <el-radio-button label="parallel">
+          多核并行
+        </el-radio-button>
+        <el-radio-button label="hybrid">
+          混合模式
+        </el-radio-button>
       </el-radio-group>
 
-      <el-button type="primary" size="small" @click="startDemo" :disabled="isRunning">
+      <el-button
+        type="primary"
+        size="small"
+        :disabled="isRunning"
+        @click="startDemo"
+      >
         {{ isRunning ? '运行中...' : '开始演示' }}
       </el-button>
 
-      <el-button size="small" @click="reset">重置</el-button>
+      <el-button
+        size="small"
+        @click="reset"
+      >
+        重置
+      </el-button>
 
-      <el-slider v-model="workerCount" :min="1" :max="8" :step="1" show-stops style="width: 150px;"
-        v-if="demoMode === 'parallel' || demoMode === 'hybrid'" />
+      <el-slider
+        v-if="demoMode === 'parallel' || demoMode === 'hybrid'"
+        v-model="workerCount"
+        :min="1"
+        :max="8"
+        :step="1"
+        show-stops
+        style="width: 150px;"
+      />
     </div>
 
     <div class="demo-grid">
@@ -26,36 +52,70 @@
           {{ demoMode === 'concurrent' ? 'CPU 核心 (单核)' : 'CPU 核心 (' + cpuCores.length + '核)' }}
         </div>
 
-        <div class="cpu-grid" :class="{ 'single-core': demoMode === 'concurrent' }">
-          <div v-for="(core, idx) in cpuCores" :key="idx" class="cpu-core" :class="{
-            'active': core.active,
-            'concurrent-mode': demoMode === 'concurrent',
-            'parallel-mode': demoMode === 'parallel'
-          }"
-            :style="{ backgroundColor: core.active ? core.color : '#f5f7fa' }">
-            <div class="core-number">CPU {{ idx + 1 }}</div>
-            <div class="core-task" v-if="core.task">{{ core.task }}</div>
-            <div class="core-status">{{ core.active ? '运行中' : '空闲' }}</div>
+        <div
+          class="cpu-grid"
+          :class="{ 'single-core': demoMode === 'concurrent' }"
+        >
+          <div
+            v-for="(core, idx) in cpuCores"
+            :key="idx"
+            class="cpu-core"
+            :class="{
+              'active': core.active,
+              'concurrent-mode': demoMode === 'concurrent',
+              'parallel-mode': demoMode === 'parallel'
+            }"
+            :style="{ backgroundColor: core.active ? core.color : '#f5f7fa' }"
+          >
+            <div class="core-number">
+              CPU {{ idx + 1 }}
+            </div>
+            <div
+              v-if="core.task"
+              class="core-task"
+            >
+              {{ core.task }}
+            </div>
+            <div class="core-status">
+              {{ core.active ? '运行中' : '空闲' }}
+            </div>
           </div>
         </div>
       </div>
 
       <!-- 任务视图 -->
       <div class="section">
-        <div class="section-title">任务执行</div>
+        <div class="section-title">
+          任务执行
+        </div>
 
         <div class="task-timeline">
-          <div v-for="(task, idx) in demoTasks" :key="task.id" class="task-row">
+          <div
+            v-for="(task, idx) in demoTasks"
+            :key="task.id"
+            class="task-row"
+          >
             <div class="task-info">
-              <div class="task-name">任务 {{ task.id }}</div>
-              <div class="task-duration">{{ task.duration }}ms</div>
+              <div class="task-name">
+                任务 {{ task.id }}
+              </div>
+              <div class="task-duration">
+                {{ task.duration }}ms
+              </div>
             </div>
 
             <div class="task-track">
-              <div v-for="(segment, sidx) in task.segments" :key="sidx" class="task-segment"
+              <div
+                v-for="(segment, sidx) in task.segments"
+                :key="sidx"
+                class="task-segment"
                 :class="{ 'execution': segment.type === 'execution', 'waiting': segment.type === 'waiting' }"
-                :style="{ left: segment.start + '%', width: segment.width + '%' }">
-                <span v-if="segment.width > 5" class="segment-text">
+                :style="{ left: segment.start + '%', width: segment.width + '%' }"
+              >
+                <span
+                  v-if="segment.width > 5"
+                  class="segment-text"
+                >
                   {{ segment.type === 'execution' ? '执行' : '等待' }}
                 </span>
               </div>
@@ -66,26 +126,46 @@
     </div>
 
     <div class="comparison-table">
-      <div class="table-header">并发 vs 并行 对比</div>
+      <div class="table-header">
+        并发 vs 并行 对比
+      </div>
 
       <div class="comparison-grid">
         <div class="comparison-item">
-          <div class="item-icon">🔄</div>
-          <div class="item-title">并发 (Concurrency)</div>
-          <div class="item-desc">多个任务交替执行，宏观上同时推进</div>
-          <div class="item-examples"><strong>例子:</strong> 单核CPU多线程、协程调度、异步I/O</div>
+          <div class="item-icon">
+            🔄
+          </div>
+          <div class="item-title">
+            并发 (Concurrency)
+          </div>
+          <div class="item-desc">
+            多个任务交替执行，宏观上同时推进
+          </div>
+          <div class="item-examples">
+            <strong>例子:</strong> 单核CPU多线程、协程调度、异步I/O
+          </div>
         </div>
 
         <div class="comparison-item">
-          <div class="item-icon">⚡</div>
-          <div class="item-title">并行 (Parallelism)</div>
-          <div class="item-desc">多个任务真正同时执行</div>
-          <div class="item-examples"><strong>例子:</strong> 多核CPU计算、GPU并行计算、分布式处理</div>
+          <div class="item-icon">
+            ⚡
+          </div>
+          <div class="item-title">
+            并行 (Parallelism)
+          </div>
+          <div class="item-desc">
+            多个任务真正同时执行
+          </div>
+          <div class="item-examples">
+            <strong>例子:</strong> 多核CPU计算、GPU并行计算、分布式处理
+          </div>
         </div>
       </div>
 
       <div class="need-table">
-        <div class="need-title">需要什么条件?</div>
+        <div class="need-title">
+          需要什么条件?
+        </div>
 
         <div class="need-items">
           <div class="need-item">

docs/.vitepress/theme/components/appendix/concurrency-models/CoroutineLightweightDemo.vue

@@ -3,13 +3,29 @@
     <h4>协程轻量级对比演示</h4>
 
     <div class="controls">
-      <el-radio-group v-model="comparisonMode" size="small">
-        <el-radio-button label="memory">内存占用对比</el-radio-button>
-        <el-radio-button label="switch">切换开销对比</el-radio-button>
-        <el-radio-button label="creation">创建速度对比</el-radio-button>
+      <el-radio-group
+        v-model="comparisonMode"
+        size="small"
+      >
+        <el-radio-button label="memory">
+          内存占用对比
+        </el-radio-button>
+        <el-radio-button label="switch">
+          切换开销对比
+        </el-radio-button>
+        <el-radio-button label="creation">
+          创建速度对比
+        </el-radio-button>
       </el-radio-group>
 
-      <el-slider v-model="coroutineCount" :min="100" :max="10000" :step="100" show-input style="width: 300px;" />
+      <el-slider
+        v-model="coroutineCount"
+        :min="100"
+        :max="10000"
+        :step="100"
+        show-input
+        style="width: 300px;"
+      />
       <span class="slider-label">{{ coroutineCount }} 个协程</span>
     </div>
 
@@ -18,27 +34,42 @@
         <h5>线程模型</h5>
         <div class="resource-visualization">
           <div class="resource-bar">
-            <div class="bar-label">内存占用</div>
+            <div class="bar-label">
+              内存占用
+            </div>
             <div class="bar-container">
-              <div class="bar-fill thread-bar" :style="{ width: threadMemoryPercent + '%', backgroundColor: '#e6a23c' }">
+              <div
+                class="bar-fill thread-bar"
+                :style="{ width: threadMemoryPercent + '%', backgroundColor: '#e6a23c' }"
+              >
                 {{ threadMemory }} MB
               </div>
             </div>
           </div>
 
           <div class="resource-bar">
-            <div class="bar-label">创建时间</div>
+            <div class="bar-label">
+              创建时间
+            </div>
             <div class="bar-container">
-              <div class="bar-fill thread-bar" :style="{ width: threadCreationPercent + '%', backgroundColor: '#e6a23c' }">
+              <div
+                class="bar-fill thread-bar"
+                :style="{ width: threadCreationPercent + '%', backgroundColor: '#e6a23c' }"
+              >
                 {{ threadCreationTime }} ms
               </div>
             </div>
           </div>
 
           <div class="resource-bar">
-            <div class="bar-label">上下文切换</div>
+            <div class="bar-label">
+              上下文切换
+            </div>
             <div class="bar-container">
-              <div class="bar-fill thread-bar" :style="{ width: 100 + '%', backgroundColor: '#e6a23c' }">
+              <div
+                class="bar-fill thread-bar"
+                :style="{ width: 100 + '%', backgroundColor: '#e6a23c' }"
+              >
                 ~1-10 μs
               </div>
             </div>
@@ -47,10 +78,16 @@
 
         <div class="thread-visualization">
           <div class="memory-blocks">
-            <div v-for="n in Math.min(coroutineCount / 100, 50)" :key="n" class="thread-block"
-              :style="{ backgroundColor: '#e6a23c', opacity: 0.6 + Math.random() * 0.4 }">
-            </div>
-            <div v-if="coroutineCount / 100 > 50" class="more-indicator">
+            <div
+              v-for="n in Math.min(coroutineCount / 100, 50)"
+              :key="n"
+              class="thread-block"
+              :style="{ backgroundColor: '#e6a23c', opacity: 0.6 + Math.random() * 0.4 }"
+            />
+            <div
+              v-if="coroutineCount / 100 > 50"
+              class="more-indicator"
+            >
               +{{ Math.floor(coroutineCount / 100 - 50) }} 更多...
             </div>
           </div>
@@ -58,36 +95,51 @@
       </div>
 
       <div class="vs-divider">
-        <div class="vs-circle">VS</div>
+        <div class="vs-circle">
+          VS
+        </div>
       </div>
 
       <div class="comparison-column">
         <h5>协程模型</h5>
         <div class="resource-visualization">
           <div class="resource-bar">
-            <div class="bar-label">内存占用</div>
+            <div class="bar-label">
+              内存占用
+            </div>
             <div class="bar-container">
-              <div class="bar-fill coroutine-bar"
-                :style="{ width: Math.max(coroutineMemoryPercent, 5) + '%', backgroundColor: '#67c23a' }">
+              <div
+                class="bar-fill coroutine-bar"
+                :style="{ width: Math.max(coroutineMemoryPercent, 5) + '%', backgroundColor: '#67c23a' }"
+              >
                 {{ coroutineMemory }} MB
               </div>
             </div>
           </div>
 
           <div class="resource-bar">
-            <div class="bar-label">创建时间</div>
+            <div class="bar-label">
+              创建时间
+            </div>
             <div class="bar-container">
-              <div class="bar-fill coroutine-bar"
-                :style="{ width: Math.max(coroutineCreationPercent, 5) + '%', backgroundColor: '#67c23a' }">
+              <div
+                class="bar-fill coroutine-bar"
+                :style="{ width: Math.max(coroutineCreationPercent, 5) + '%', backgroundColor: '#67c23a' }"
+              >
                 {{ coroutineCreationTime }} ms
               </div>
             </div>
           </div>
 
           <div class="resource-bar">
-            <div class="bar-label">上下文切换</div>
+            <div class="bar-label">
+              上下文切换
+            </div>
             <div class="bar-container">
-              <div class="bar-fill coroutine-bar" :style="{ width: 15 + '%', backgroundColor: '#67c23a' }">
+              <div
+                class="bar-fill coroutine-bar"
+                :style="{ width: 15 + '%', backgroundColor: '#67c23a' }"
+              >
                 ~100 ns
               </div>
             </div>
@@ -96,17 +148,30 @@
 
         <div class="coroutine-visualization">
           <div class="coroutine-grid">
-            <div v-for="n in Math.min(coroutineCount / 10, 100)" :key="n" class="coroutine-cell"
-              :style="{ backgroundColor: '#67c23a', opacity: 0.5 + Math.random() * 0.5 }">
-            </div>
-            <div v-if="coroutineCount / 10 > 100" class="more-indicator">
+            <div
+              v-for="n in Math.min(coroutineCount / 10, 100)"
+              :key="n"
+              class="coroutine-cell"
+              :style="{ backgroundColor: '#67c23a', opacity: 0.5 + Math.random() * 0.5 }"
+            />
+            <div
+              v-if="coroutineCount / 10 > 100"
+              class="more-indicator"
+            >
               +{{ Math.floor(coroutineCount / 10 - 100) }} 更多...
             </div>
           </div>
         </div>
 
-        <div class="efficiency-badge" v-if="coroutineCount >= 1000">
-          <el-tag type="success" effect="dark" size="large">
+        <div
+          v-if="coroutineCount >= 1000"
+          class="efficiency-badge"
+        >
+          <el-tag
+            type="success"
+            effect="dark"
+            size="large"
+          >
             🚀 节省 {{ savingsPercent }}% 内存
           </el-tag>
         </div>
@@ -114,8 +179,13 @@
     </div>
 
     <div class="insight-panel">
-      <el-alert :title="insightTitle" :type="insightType" :description="insightDescription" show-icon
-        :closable="false" />
+      <el-alert
+        :title="insightTitle"
+        :type="insightType"
+        :description="insightDescription"
+        show-icon
+        :closable="false"
+      />
     </div>
   </div>
 </template>

docs/.vitepress/theme/components/appendix/concurrency-models/EventLoopDemo.vue

@@ -3,37 +3,91 @@
     <h4>事件循环 (Event Loop) 演示</h4>
 
     <div class="controls">
-      <el-button type="primary" size="small" @click="startSimulation" :disabled="isRunning">
+      <el-button
+        type="primary"
+        size="small"
+        :disabled="isRunning"
+        @click="startSimulation"
+      >
         {{ isRunning ? '运行中...' : '开始模拟' }}
       </el-button>
-      <el-button size="small" @click="addTask" :disabled="tasks.length >= 10">
+      <el-button
+        size="small"
+        :disabled="tasks.length >= 10"
+        @click="addTask"
+      >
         添加任务
       </el-button>
-      <el-button size="small" @click="addMicrotask" :disabled="microtasks.length >= 5">
+      <el-button
+        size="small"
+        :disabled="microtasks.length >= 5"
+        @click="addMicrotask"
+      >
         添加微任务
       </el-button>
-      <el-button size="small" @click="reset">重置</el-button>
+      <el-button
+        size="small"
+        @click="reset"
+      >
+        重置
+      </el-button>
 
-      <el-select v-model="simulationSpeed" size="small" style="width: 120px;">
-        <el-option :value="1" label="慢速" />
-        <el-option :value="2" label="正常" />
-        <el-option :value="3" label="快速" />
-        <el-option :value="4" label="极快" />
-        <el-option :value="5" label="即时" />
+      <el-select
+        v-model="simulationSpeed"
+        size="small"
+        style="width: 120px;"
+      >
+        <el-option
+          :value="1"
+          label="慢速"
+        />
+        <el-option
+          :value="2"
+          label="正常"
+        />
+        <el-option
+          :value="3"
+          label="快速"
+        />
+        <el-option
+          :value="4"
+          label="极快"
+        />
+        <el-option
+          :value="5"
+          label="即时"
+        />
       </el-select>
     </div>
 
     <div class="event-loop-container">
       <!-- 调用栈 -->
       <div class="section">
-        <div class="section-title">调用栈 (Call Stack)</div>
+        <div class="section-title">
+          调用栈 (Call Stack)
+        </div>
         <div class="stack-container">
-          <div v-for="(frame, idx) in callStack" :key="idx" class="stack-frame" :class="{ active: idx === 0 }"
-            :style="{ animationDelay: idx * 0.1 + 's' }">
-            <div class="frame-name">{{ frame.name }}</div>
-            <div class="frame-line" v-if="frame.line">第 {{ frame.line }} 行</div>
+          <div
+            v-for="(frame, idx) in callStack"
+            :key="idx"
+            class="stack-frame"
+            :class="{ active: idx === 0 }"
+            :style="{ animationDelay: idx * 0.1 + 's' }"
+          >
+            <div class="frame-name">
+              {{ frame.name }}
+            </div>
+            <div
+              v-if="frame.line"
+              class="frame-line"
+            >
+              第 {{ frame.line }} 行
+            </div>
           </div>
-          <div v-if="callStack.length === 0" class="empty-stack">
+          <div
+            v-if="callStack.length === 0"
+            class="empty-stack"
+          >
             栈为空
           </div>
         </div>
@@ -41,32 +95,67 @@
 
       <!-- 事件循环 -->
       <div class="section event-loop">
-        <div class="section-title">事件循环 (Event Loop)</div>
+        <div class="section-title">
+          事件循环 (Event Loop)
+        </div>
         <div class="loop-container">
-          <div class="loop-arrow" :class="{ rotating: isRunning }">
-            <svg viewBox="0 0 100 100" class="loop-svg">
-              <circle cx="50" cy="50" r="40" fill="none" stroke="#409eff" stroke-width="4" stroke-dasharray="200" stroke-linecap="round"
-                class="loop-circle" />
-              <polygon points="85,50 75,45 75,55" fill="#409eff" class="loop-arrowhead" />
+          <div
+            class="loop-arrow"
+            :class="{ rotating: isRunning }"
+          >
+            <svg
+              viewBox="0 0 100 100"
+              class="loop-svg"
+            >
+              <circle
+                cx="50"
+                cy="50"
+                r="40"
+                fill="none"
+                stroke="#409eff"
+                stroke-width="4"
+                stroke-dasharray="200"
+                stroke-linecap="round"
+                class="loop-circle"
+              />
+              <polygon
+                points="85,50 75,45 75,55"
+                fill="#409eff"
+                class="loop-arrowhead"
+              />
             </svg>
           </div>
-          <div class="loop-label">检查</div>
+          <div class="loop-label">
+            检查
+          </div>
         </div>
 
         <div class="loop-description">
-          <div class="step" :class="{ active: currentStep === 1 }">
+          <div
+            class="step"
+            :class="{ active: currentStep === 1 }"
+          >
             <span class="step-num">1</span>
             <span class="step-text">执行调用栈中的同步代码</span>
           </div>
-          <div class="step" :class="{ active: currentStep === 2 }">
+          <div
+            class="step"
+            :class="{ active: currentStep === 2 }"
+          >
             <span class="step-num">2</span>
             <span class="step-text">执行所有微任务 (microtasks)</span>
           </div>
-          <div class="step" :class="{ active: currentStep === 3 }">
+          <div
+            class="step"
+            :class="{ active: currentStep === 3 }"
+          >
             <span class="step-num">3</span>
             <span class="step-text">渲染 UI (如果需要)</span>
           </div>
-          <div class="step" :class="{ active: currentStep === 4 }">
+          <div
+            class="step"
+            :class="{ active: currentStep === 4 }"
+          >
             <span class="step-num">4</span>
             <span class="step-text">执行宏任务 (macrotask)</span>
           </div>
@@ -75,31 +164,51 @@
 
       <!-- 任务队列 -->
       <div class="section">
-        <div class="section-title">任务队列</div>
+        <div class="section-title">
+          任务队列
+        </div>
 
         <div class="queue microtask-queue">
-          <div class="queue-title">微任务队列 (Microtasks)</div>
+          <div class="queue-title">
+            微任务队列 (Microtasks)
+          </div>
           <div class="queue-items">
-            <div v-for="(task, idx) in microtasks" :key="task.id" class="queue-item microtask"
-              :style="{ animationDelay: idx * 0.1 + 's' }">
+            <div
+              v-for="(task, idx) in microtasks"
+              :key="task.id"
+              class="queue-item microtask"
+              :style="{ animationDelay: idx * 0.1 + 's' }"
+            >
               <span class="task-name">{{ task.name }}</span>
               <span class="task-priority">高优先级</span>
             </div>
-            <div v-if="microtasks.length === 0" class="empty-queue">
+            <div
+              v-if="microtasks.length === 0"
+              class="empty-queue"
+            >
               队列为空
             </div>
           </div>
         </div>
 
         <div class="queue macrotask-queue">
-          <div class="queue-title">宏任务队列 (Macrotasks)</div>
+          <div class="queue-title">
+            宏任务队列 (Macrotasks)
+          </div>
           <div class="queue-items">
-            <div v-for="(task, idx) in tasks" :key="task.id" class="queue-item macrotask"
-              :style="{ animationDelay: idx * 0.15 + 's' }">
+            <div
+              v-for="(task, idx) in tasks"
+              :key="task.id"
+              class="queue-item macrotask"
+              :style="{ animationDelay: idx * 0.15 + 's' }"
+            >
               <span class="task-name">{{ task.name }}</span>
               <span class="task-type">{{ task.type }}</span>
             </div>
-            <div v-if="tasks.length === 0" class="empty-queue">
+            <div
+              v-if="tasks.length === 0"
+              class="empty-queue"
+            >
               队列为空
             </div>
           </div>

docs/.vitepress/theme/components/appendix/concurrency-models/GoroutineGreenThreadDemo.vue

@@ -3,38 +3,78 @@
     <h4>Go 协程 (Goroutine) 与 GMP 调度演示</h4>
 
     <div class="controls">
-      <el-radio-group v-model="viewMode" size="small">
-        <el-radio-button label="overview">整体视图</el-radio-button>
-        <el-radio-button label="gmp">GMP 调度</el-radio-button>
-        <el-radio-button label="channel">Channel 通信</el-radio-button>
+      <el-radio-group
+        v-model="viewMode"
+        size="small"
+      >
+        <el-radio-button label="overview">
+          整体视图
+        </el-radio-button>
+        <el-radio-button label="gmp">
+          GMP 调度
+        </el-radio-button>
+        <el-radio-button label="channel">
+          Channel 通信
+        </el-radio-button>
       </el-radio-group>
 
-      <el-button type="primary" size="small" @click="startDemo" :disabled="isRunning">
+      <el-button
+        type="primary"
+        size="small"
+        :disabled="isRunning"
+        @click="startDemo"
+      >
         {{ isRunning ? '运行中...' : '开始演示' }}
       </el-button>
 
-      <el-button size="small" @click="addGoroutine" :disabled="goroutines.length >= 20">
+      <el-button
+        size="small"
+        :disabled="goroutines.length >= 20"
+        @click="addGoroutine"
+      >
         +Goroutine
       </el-button>
 
-      <el-button size="small" @click="reset">重置</el-button>
+      <el-button
+        size="small"
+        @click="reset"
+      >
+        重置
+      </el-button>
     </div>
 
     <!-- GMP 调度视图 -->
-    <div v-if="viewMode === 'gmp' || viewMode === 'overview'" class="gmp-view">
+    <div
+      v-if="viewMode === 'gmp' || viewMode === 'overview'"
+      class="gmp-view"
+    >
       <div class="gmp-container">
         <!-- Global Queue -->
         <div class="queue-section global-queue">
           <div class="queue-header">
             <span class="queue-name">Global Queue (G)</span>
-            <el-tag size="small" type="info">{{ globalQueue.length }}</el-tag>
+            <el-tag
+              size="small"
+              type="info"
+            >
+              {{ globalQueue.length }}
+            </el-tag>
           </div>
           <div class="queue-content">
-            <div v-for="g in globalQueue" :key="g.id" class="g-item"
-              :style="{ backgroundColor: g.color }">
+            <div
+              v-for="g in globalQueue"
+              :key="g.id"
+              class="g-item"
+              :style="{ backgroundColor: g.color }"
+            >
               G{{ g.id }}
             </div>
-            <div v-if="globalQueue.length === 0" class="empty-queue">空</div>
+            <div
+              v-if="globalQueue.length === 0"
+              class="empty-queue"
+            >
+              空
+            </div>
           </div>
         </div>
 
@@ -45,26 +85,47 @@
           </div>
 
           <div class="processors-grid">
-            <div v-for="(p, idx) in processors" :key="idx" class="processor"
+            <div
+              v-for="(p, idx) in processors"
+              :key="idx"
+              class="processor"
               :class="{ 'active': p.active }"
-              :style="{ borderColor: p.active ? p.color : '#e4e7ed' }">
+              :style="{ borderColor: p.active ? p.color : '#e4e7ed' }"
+            >
               <div class="processor-header">
                 <span class="processor-name">P{{ idx }}</span>
-                <span class="processor-status" :class="{ 'running': p.active }">{{ p.active ? '运行中' : '空闲' }}</span>
+                <span
+                  class="processor-status"
+                  :class="{ 'running': p.active }"
+                >{{ p.active ? '运行中' : '空闲' }}</span>
               </div>
 
               <div class="local-queue">
-                <div class="queue-label">本地队列</div>
+                <div class="queue-label">
+                  本地队列
+                </div>
                 <div class="local-g-list">
-                  <div v-for="g in p.localQueue" :key="g.id" class="local-g-item"
-                    :style="{ backgroundColor: g.color }">
+                  <div
+                    v-for="g in p.localQueue"
+                    :key="g.id"
+                    class="local-g-item"
+                    :style="{ backgroundColor: g.color }"
+                  >
                     G{{ g.id }}
                   </div>
-                  <div v-if="p.localQueue.length === 0" class="empty-local">-</div>
+                  <div
+                    v-if="p.localQueue.length === 0"
+                    class="empty-local"
+                  >
+                    -
+                  </div>
                 </div>
               </div>
 
-              <div class="m-binding" v-if="p.m">
+              <div
+                v-if="p.m"
+                class="m-binding"
+              >
                 <span class="m-label">绑定 M{{ p.m.id }}</span>
               </div>
             </div>
@@ -78,9 +139,13 @@
           </div>
 
           <div class="machines-list">
-            <div v-for="m in machines" :key="m.id" class="machine-item"
+            <div
+              v-for="m in machines"
+              :key="m.id"
+              class="machine-item"
               :class="{ 'active': m.active }"
-              :style="{ borderColor: m.active ? '#67c23a' : '#e4e7ed' }">
+              :style="{ borderColor: m.active ? '#67c23a' : '#e4e7ed' }"
+            >
               <span class="machine-id">M{{ m.id }}</span>
               <span class="machine-status">{{ m.active ? '运行中' : '休眠' }}</span>
             </div>
@@ -90,9 +155,13 @@
     </div>
 
     <div class="explanation">
-      <el-alert title="GMP 调度模型" type="success"
+      <el-alert
+        title="GMP 调度模型"
+        type="success"
         :description="gmpDescription"
-        show-icon :closable="false" />
+        show-icon
+        :closable="false"
+      />
     </div>
   </div>
 </template>

docs/.vitepress/theme/components/appendix/concurrency-models/ProcessIsolationDemo.vue

@@ -3,22 +3,40 @@
     <h4>进程内存隔离演示</h4>
 
     <div class="controls">
-      <el-button type="primary" size="small" @click="addProcess" :disabled="processes.length >= 4">
+      <el-button
+        type="primary"
+        size="small"
+        :disabled="processes.length >= 4"
+        @click="addProcess"
+      >
         创建进程
       </el-button>
-      <el-button type="danger" size="small" @click="killProcess" :disabled="processes.length === 0">
+      <el-button
+        type="danger"
+        size="small"
+        :disabled="processes.length === 0"
+        @click="killProcess"
+      >
         结束进程
       </el-button>
-      <el-button size="small" @click="simulateCrash">
+      <el-button
+        size="small"
+        @click="simulateCrash"
+      >
         模拟进程崩溃
       </el-button>
-      <el-button size="small" @click="reset">
+      <el-button
+        size="small"
+        @click="reset"
+      >
         重置
       </el-button>
     </div>
 
     <div class="memory-view">
-      <div class="memory-label">系统内存</div>
+      <div class="memory-label">
+        系统内存
+      </div>
       <div class="memory-blocks">
         <div
           v-for="process in processes"
@@ -49,18 +67,33 @@
               <span class="section-size">{{ process.stackSize }}MB</span>
             </div>
           </div>
-          <div v-if="process.crashed" class="crash-overlay">
+          <div
+            v-if="process.crashed"
+            class="crash-overlay"
+          >
             <span class="crash-text">💥 已崩溃</span>
             <span class="crash-info">不影响其他进程</span>
           </div>
         </div>
       </div>
 
-      <div class="shared-memory" v-if="showSharedMemory">
-        <div class="shared-label">共享内存区域 (IPC)</div>
+      <div
+        v-if="showSharedMemory"
+        class="shared-memory"
+      >
+        <div class="shared-label">
+          共享内存区域 (IPC)
+        </div>
         <div class="shared-content">
-          <div v-for="process in processes" :key="process.id" class="shared-access">
-            <span class="access-indicator" :style="{ backgroundColor: process.color }"></span>
+          <div
+            v-for="process in processes"
+            :key="process.id"
+            class="shared-access"
+          >
+            <span
+              class="access-indicator"
+              :style="{ backgroundColor: process.color }"
+            />
             <span>进程 {{ process.id }} 可以访问</span>
           </div>
         </div>

docs/.vitepress/theme/components/appendix/concurrency-models/ProcessThreadCoroutineDemo.vue

@@ -3,27 +3,50 @@
     <h4>进程 / 线程 / 协程 对比演示</h4>
 
     <div class="controls">
-      <el-radio-group v-model="model" size="small">
-        <el-radio-button label="process">多进程</el-radio-button>
-        <el-radio-button label="thread">多线程</el-radio-button>
-        <el-radio-button label="coroutine">协程</el-radio-button>
+      <el-radio-group
+        v-model="model"
+        size="small"
+      >
+        <el-radio-button label="process">
+          多进程
+        </el-radio-button>
+        <el-radio-button label="thread">
+          多线程
+        </el-radio-button>
+        <el-radio-button label="coroutine">
+          协程
+        </el-radio-button>
       </el-radio-group>
 
       <el-button
         type="primary"
         size="small"
-        @click="startSimulation"
         :disabled="isRunning"
+        @click="startSimulation"
       >
         {{ isRunning ? '运行中...' : '开始模拟' }}
       </el-button>
     </div>
 
     <div class="stats-bar">
-      <el-statistic title="内存占用" :value="memoryUsage" suffix="MB" />
-      <el-statistic title="上下文切换" :value="contextSwitches" />
-      <el-statistic title="完成任务" :value="completedTasks" />
-      <el-statistic title="耗时" :value="elapsedTime" suffix="ms" />
+      <el-statistic
+        title="内存占用"
+        :value="memoryUsage"
+        suffix="MB"
+      />
+      <el-statistic
+        title="上下文切换"
+        :value="contextSwitches"
+      />
+      <el-statistic
+        title="完成任务"
+        :value="completedTasks"
+      />
+      <el-statistic
+        title="耗时"
+        :value="elapsedTime"
+        suffix="ms"
+      />
     </div>
 
     <div class="visualization">
@@ -35,7 +58,10 @@
           :class="{ active: core.active, type: core.type }"
         >
           <span class="core-label">CPU {{ idx + 1 }}</span>
-          <div class="task-indicator" v-if="core.task">
+          <div
+            v-if="core.task"
+            class="task-indicator"
+          >
             {{ core.task }}
           </div>
         </div>

docs/.vitepress/theme/components/appendix/concurrency-models/ThreadSchedulingDemo.vue

@@ -3,13 +3,27 @@
     <h4>线程调度演示</h4>
 
     <div class="controls">
-      <el-radio-group v-model="schedulingPolicy" size="small">
-        <el-radio-button label="fifo">FIFO (先来先服务)</el-radio-button>
-        <el-radio-button label="roundrobin">时间片轮转</el-radio-button>
-        <el-radio-button label="priority">优先级调度</el-radio-button>
+      <el-radio-group
+        v-model="schedulingPolicy"
+        size="small"
+      >
+        <el-radio-button label="fifo">
+          FIFO (先来先服务)
+        </el-radio-button>
+        <el-radio-button label="roundrobin">
+          时间片轮转
+        </el-radio-button>
+        <el-radio-button label="priority">
+          优先级调度
+        </el-radio-button>
       </el-radio-group>
 
-      <el-button type="primary" size="small" @click="addThread" :disabled="threads.length >= 6">
+      <el-button
+        type="primary"
+        size="small"
+        :disabled="threads.length >= 6"
+        @click="addThread"
+      >
         添加线程
       </el-button>
 
@@ -21,7 +35,10 @@
         {{ isRunning ? '暂停' : '开始调度' }}
       </el-button>
 
-      <el-button size="small" @click="reset">
+      <el-button
+        size="small"
+        @click="reset"
+      >
         重置
       </el-button>
     </div>
@@ -29,12 +46,24 @@
     <div class="timeline-container">
       <div class="timeline-header">
         <span class="timeline-label">时间轴</span>
-        <div class="time-marker">0ms</div>
-        <div class="time-marker">100ms</div>
-        <div class="time-marker">200ms</div>
-        <div class="time-marker">300ms</div>
-        <div class="time-marker">400ms</div>
-        <div class="time-marker">500ms</div>
+        <div class="time-marker">
+          0ms
+        </div>
+        <div class="time-marker">
+          100ms
+        </div>
+        <div class="time-marker">
+          200ms
+        </div>
+        <div class="time-marker">
+          300ms
+        </div>
+        <div class="time-marker">
+          400ms
+        </div>
+        <div class="time-marker">
+          500ms
+        </div>
       </div>
 
       <div class="thread-rows">
@@ -44,11 +73,17 @@
           class="thread-row"
         >
           <div class="thread-info">
-            <div class="thread-name" :style="{ color: thread.color }">
+            <div
+              class="thread-name"
+              :style="{ color: thread.color }"
+            >
               {{ thread.name }}
             </div>
             <div class="thread-details">
-              <el-tag size="small" :type="thread.state === 'running' ? 'success' : thread.state === 'ready' ? 'warning' : 'info'">
+              <el-tag
+                size="small"
+                :type="thread.state === 'running' ? 'success' : thread.state === 'ready' ? 'warning' : 'info'"
+              >
                 {{ stateText(thread.state) }}
               </el-tag>
               <span class="priority">优先级: {{ thread.priority }}</span>
@@ -63,8 +98,14 @@
               :class="{ running: slot.state === 'running', blocked: slot.state === 'blocked' }"
               :style="{ left: slot.start + '%', width: slot.width + '%', backgroundColor: slot.state === 'running' ? thread.color : '#dcdfe6' }"
             >
-              <span v-if="slot.state === 'running'" class="slot-label">运行</span>
-              <span v-else class="slot-label">等待</span>
+              <span
+                v-if="slot.state === 'running'"
+                class="slot-label"
+              >运行</span>
+              <span
+                v-else
+                class="slot-label"
+              >等待</span>
             </div>
 
             <div
@@ -72,7 +113,7 @@
               class="current-indicator"
               :style="{ left: currentTime + '%', backgroundColor: thread.color }"
             >
-              <div class="indicator-arrow"></div>
+              <div class="indicator-arrow" />
             </div>
           </div>
         </div>
@@ -81,20 +122,36 @@
 
     <div class="stats-panel">
       <div class="stat-item">
-        <div class="stat-value">{{ completedThreads }}</div>
-        <div class="stat-label">已完成线程</div>
+        <div class="stat-value">
+          {{ completedThreads }}
+        </div>
+        <div class="stat-label">
+          已完成线程
+        </div>
       </div>
       <div class="stat-item">
-        <div class="stat-value">{{ contextSwitches }}</div>
-        <div class="stat-label">上下文切换</div>
+        <div class="stat-value">
+          {{ contextSwitches }}
+        </div>
+        <div class="stat-label">
+          上下文切换
+        </div>
       </div>
       <div class="stat-item">
-        <div class="stat-value">{{ avgWaitTime }}ms</div>
-        <div class="stat-label">平均等待时间</div>
+        <div class="stat-value">
+          {{ avgWaitTime }}ms
+        </div>
+        <div class="stat-label">
+          平均等待时间
+        </div>
       </div>
       <div class="stat-item">
-        <div class="stat-value">{{ throughput }}</div>
-        <div class="stat-label">吞吐量 (线程/秒)</div>
+        <div class="stat-value">
+          {{ throughput }}
+        </div>
+        <div class="stat-label">
+          吞吐量 (线程/秒)
+        </div>
       </div>
     </div>