docs: update terminal intro content and components

docs/zh-cn/appendix/terminal-intro.md

@@ -4,6 +4,10 @@
 
 ## 1. 概念界定：终端是什么？ (Definition)
 
+*不同操作系统下的终端长相不同，**命令方式也不同**。点击下方按钮切换查看，注意观察 Windows 和 Linux 是如何用不同的命令（如 `dir` vs `ls`）做同一件事的：*
+
+<TerminalOSDemo />
+
 在图形用户界面（GUI）普及之前，终端是人类与计算机交互的主要方式。即便在今天，它依然是开发者控制计算机最精确、最高效的工具。
 
 <TerminalDefinition />
@@ -31,25 +35,28 @@
 
 它不处理复杂的图形、图片或视频，而是专注于**文本信息的交互**。
 
-## 2. 核心架构：终端与 Shell (The Architecture)
+## 2. 核心架构：三者关系大白话 (The Big Picture)
 
-初学者常混淆“终端”与“Shell”，理解两者的区别是掌握命令行的关键。它们在计算机历史中演化为两个独立的组件：
+别被专业术语吓跑，其实它们就是三个分工明确的“打工人”：
 
--   **终端 (Terminal)**：负责“交互”。
-    它是一个负责显示字符、接收键盘输入的**窗口程序**。它本身不懂任何逻辑，只负责传输数据。
-    *常见的终端软件：macOS Terminal, iTerm2, Windows Terminal, Hyper.*
+-   **终端 (Terminal) —— 只是个“传声筒”**
+    *   它只负责**显示画面**和**接收按键**。
+    *   它本身**没有任何智能**，就像一个显示器或键盘。
+    *   *它不管你输入的是命令还是乱码，只管把字显示出来。*
 
--   **Shell (壳 / 命令解释器)**：负责“逻辑”。
-    它是运行在终端内部的**后端程序**，负责接收你的指令、解析语义、调用系统内核并返回结果。
-    *常见的 Shell：bash, zsh, fish, sh.*
+-   **Shell (壳) —— 真正的“翻译官”**
+    *   它才是有逻辑的程序。
+    *   它负责**听懂**你的命令（比如 `ls`），把它**翻译**成电脑能听懂的指令，然后指挥内核去干活。
+    *   *就像 Siri 或小爱同学，听懂你的话，然后去调动手机功能。*
 
-**类比理解**：
-如果把计算机操作比作去餐厅点餐：
--   **终端**是**餐桌和菜单**（负责展示信息、提供输入界面，但它自己不会做菜）。
--   **Shell**是**服务员**（负责听取你的点单，交给后厨处理，并把结果端回来）。
--   **内核**是**后厨**（负责真正的执行和运算）。
+-   **内核 (Kernel) —— 幕后的“大管家”**
+    *   它是操作系统的核心，只有它能直接控制硬件（硬盘、CPU）。
+    *   **Shell 不包含内核**，Shell 只是站在门口喊话的人，内核才是屋里干活的人。
 
-*下面的演示直观展示了从“点餐”到“上菜”的全过程：*
+**一句话总结流程**：
+你在**终端**（窗口）打字 ➡️ **Shell**（翻译官）听懂并指挥 ➡️ **内核**（大管家）去硬件里干活。
+
+*下面的演示展示了这个过程，注意看 Shell 和内核之间那道“墙”：*
 
 <ArchitectureDemo />
 
@@ -88,9 +95,13 @@
 -   序列 `\033[31m` → **指令**：将后续文字颜色设为红色。
 -   序列 `\033[2J` → **指令**：清空屏幕。
 
-这就是为什么有时候在日志文件中会看到乱码（如 `^[[31m`），那其实是未被正确解析的颜色指令。
+这就好比你和朋友约定：如果我正常说话，你就记录下来；如果我举起左手（相当于 `ESC`），接下来的那句话就是命令而不是内容。
 
-*下方组件展示了转义序列如何实时改变终端的渲染状态：*
+*点击下方的“播放”按钮，观察终端是如何逐个处理字符流，并识别出隐藏的指令：*
+
+<EscapeParserDemo />
+
+*下方组件则展示了更多种类的转义序列及其渲染效果：*
 
 <EscapeSequences />
 
@@ -110,21 +121,25 @@
 
 <InputVisualizer />
 
-## 6. 运行模式：加工与原始 (Cooked vs. Raw Mode)
+## 6. 运行模式：打字机 vs 游戏机 (Cooked vs. Raw Mode)
 
-终端有两种主要的工作模式，决定了输入数据如何被处理。理解这一点能帮你明白为什么 `ls` 命令和 `vim` 编辑器的操作体验完全不同。
+终端有两种截然不同的性格。理解这一点，你就能明白为什么在终端里**打命令**和**玩贪吃蛇**是完全不同的体验。
 
--   **加工模式 (Cooked Mode / Canonical Mode)**：
-    这是标准 Shell 的默认模式。
-    -   **行为**：终端会**缓存**你的输入，允许你使用退格键修改。只有当你按下回车键（Enter）后，整行数据才会一次性发送给程序。
-    -   **类比**：像在写信，写完一整句确认无误后才寄出。
-    -   *适用场景：日常命令输入。*
+-   **加工模式 (Cooked Mode) —— 像打字机**
+    *   这是默认模式。
+    *   **行为**：你输入的字符会被终端**暂时扣留**，直到你按下回车键（Enter）。
+    *   **好处**：这给了你修改的机会。打错了？按退格键（Backspace）删掉重写，程序根本不知道你之前打错过。
+    *   *适用场景：平时敲命令（如 `ls`, `cd`）。*
 
--   **原始模式 (Raw Mode)**：
-    这是高级交互程序的模式。
-    -   **行为**：终端不进行任何缓冲或处理，将每一个按键（包括修饰键）**即时**发送给程序。
-    -   **类比**：像打电玩，按下一个键，角色立刻做出反应。
-    -   *适用场景：Vim 编辑器、终端游戏、交互式菜单。*
+-   **原始模式 (Raw Mode) —— 像游戏手柄**
+    *   这是“高手”模式。
+    *   **行为**：你按下的每一个键（包括方向键、Ctrl组合键），都会**瞬间**发送给程序，没有任何缓冲。
+    *   **好处**：程序能实时响应你的操作。
+    *   *适用场景：玩终端游戏（如贪吃蛇）、使用 Vim 编辑器（一种纯键盘操作的编辑器）。*
+
+*点击下方按钮切换模式，体验“写信”与“打游戏”的不同手感：*
+
+<CookedRawDemo />
 
 ## 7. 进程控制：信号 (Signals)
 
@@ -140,15 +155,24 @@
 
 ## 8. 高级应用：全屏界面与缓冲区 (Buffers & TUI)
 
-现代终端应用（TUI, Text User Interface）如 `vim`、`htop` 或 `tmux`，能够像图形软件一样利用整个屏幕，这得益于**备用屏幕缓冲区 (Alternate Screen Buffer)**。
+你有没有发现，当你用 `vim` 编辑文件或者用 `htop` 看系统状态时，它们会占满整个屏幕？而当你退出它们时，屏幕瞬间变回了原来的样子，之前的命令记录完全没变。
 
-终端通常维护两块“画布”：
-1.  **主缓冲区 (Primary Buffer)**：保存命令历史，即我们日常滚动查看的流式界面。
-2.  **备用缓冲区 (Alternate Buffer)**：一块独立的、不保存历史的画布，供全屏应用使用。
+这是因为终端有两块“画布”在来回切换：
 
-当你打开 `vim` 时，终端切换到备用缓冲区；当你退出 `vim` 时，终端切回主缓冲区。这就是为什么退出编辑器后，之前的命令历史依然完好无损地留在屏幕上。
+*   **主缓冲区 (Primary Buffer)**：就像**草稿本**。
+    *   你写一行，系统回一行。
+    *   写满了就翻页（滚动），以前写的东西都在上面。
+    *   *用于：日常敲命令。*
 
-<AdvancedTUIDemo />
+*   **备用缓冲区 (Alternate Buffer)**：就像**黑板**。
+    *   程序把黑板擦干净，在上面画画（全屏显示）。
+    *   不管怎么画，都不会影响你桌子上的草稿本。
+    *   当你退出程序时，就像把黑板收起来，你又回到了草稿本面前。
+    *   *用于：Vim, Nano, 游戏等全屏软件。*
+
+*点击下方按钮，体验“草稿本”和“黑板”是如何瞬间切换的：*
+
+<BufferSwitchDemo />
 
 ---