htmx 内核玩具

从零实现的迷你 htmx:扫描 hx-* 属性 → 解析 hx-trigger(delay/throttle/once/changed)→ 发出 mock 请求 → 按 hx-swap 六种语义交换 DOM。改左边标记,点「应用」,然后在预览区里真的点它——右侧日志打印每一次「网络往返」的完整决策链。

标记(可编辑)

120ms
mock 路由表
GET /clicked → 「已点击」span
GET /search?q= → 过滤条目列表
GET /time → 当前时间
GET /more → 新列表项
POST /vote → 票数 span

预览(真的可交互)

请求日志

日志顺序 = htmx 内核决策顺序:trigger 规范解析 → 请求组装 → (模拟)网络 → hx-swap 交换。防抖/节流窗口内的静默丢弃也会记录。