wonder
5f99d2481a
- style-keys.md: add v-clicks to 3x2 grid for staggered animation - eino-graph.md: two-column layout (code left, Items right) - eino-deep-dive.md: two-column layout for both slides, code+Items side-by-side - async-deep-dive.md: two-column layout for both slides, SVG integrated - harness.md: two-column layout for slide 1 (code left, Items right) - request-journey.md: two-column layout for journey steps - data-model.md: add v-clicks to grid items, increase diagram height - architecture/pipeline/prompt-agent: increase SVG max-height for better visibility
56 lines
1.2 KiB
Markdown
56 lines
1.2 KiB
Markdown
# 一次请求的完整旅程
|
||
|
||
从 HTTP 到像素 — 追踪一个生成请求的全链路
|
||
|
||
<div class="text-sm mt-2">
|
||
|
||
```
|
||
POST /api/v1/generate {prompt: "像素风骑士", assetType: "sprite", style: {artStyle: "pixel"}}
|
||
```
|
||
|
||
</div>
|
||
|
||
<div class="grid grid-cols-2 gap-4 mt-2">
|
||
|
||
<div>
|
||
|
||
<v-clicks>
|
||
|
||
<Item title="① Middleware 层（~1ms）">
|
||
JWT 认证 → 解析 userID → 用户级限流（Redis Lua）→ 全局限流 → 放行
|
||
</Item>
|
||
|
||
<Item title="② Handler 层（~5ms）">
|
||
参数校验 → 去重检查 → 创建 Task（DB 写入）→ 入队 TaskQueue → 返回 `taskId`
|
||
</Item>
|
||
|
||
</v-clicks>
|
||
|
||
</div>
|
||
|
||
<div>
|
||
|
||
<v-clicks>
|
||
|
||
<Item title="③ Pipeline 执行（~30s）">
|
||
goroutine 取任务 → PromptOptimizer → AssetGenerator → QualitySupervisor（可能重试）→ FormatAdapter（精灵表 + GIF）
|
||
</Item>
|
||
|
||
<Item title="④ 收尾（~2s）">
|
||
上传七牛云 Kodo → 写入 Asset 表 → 更新 Task 完成 → WebSocket 推送
|
||
</Item>
|
||
|
||
</v-clicks>
|
||
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<div v-click class="mt-2 text-center text-gray-400 text-sm">
|
||
全程异步：前端拿到 taskId 后通过 WebSocket 实时监听进度变化
|
||
</div>
|
||
|
||
<!--
|
||
这就是一个请求的完整生命周期。注意看耗时分布：管线占了 95% 的时间，这就是为什么要做异步。
|
||
-->
|