操：一張時(shí)序圖講清緩存缺失的 API 調(diào)用鏈)
Archify 實(shí)操一張時(shí)序圖講清緩存缺失的 API 調(diào)用鏈【免費(fèi)下載鏈接】archifyAgent skill for beautiful, verifiable architecture, workflow, sequence,>項(xiàng)目地址: https://gitcode.com/GitHub_Trending/arch/archify排查這次請求為什么慢時(shí)日志給你的是碎片而一張時(shí)序圖給你的是因果。Archify 是一個(gè)面向 AI Agent 的圖表技能把代碼庫或一段系統(tǒng)描述編譯成五種可驗(yàn)證的交互式圖表——架構(gòu)圖、工作流圖、時(shí)序圖、數(shù)據(jù)流圖、生命周期圖產(chǎn)物是一份帶動畫、可多倍率導(dǎo)出的自包含 HTML。下面用官方緩存缺失請求示例把這條鏈路從寫、到驗(yàn)、到講給人看完整走一遍。排查一次變慢的請求從一張能講清楚的圖開始設(shè)想這個(gè)場景用戶打開儀表盤頁面接口比平時(shí)慢了 300ms。你要給同事講清楚錢花在哪請求經(jīng)過幾跳、鑒權(quán)花了多久、緩存是命中還是缺失、回源數(shù)據(jù)庫的窗口有多短?？陬^講容易丟細(xì)節(jié)Mermaid 手畫又常常畫錯、畫丑最后還得截圖貼文檔。Archify 的思路是把畫圖拆成兩半語義由你和 Agent 描述空間布局與美觀交給渲染器兜底。你只寫一份帶類型的 JSON IR渲染器按 schema 嚴(yán)格校驗(yàn)、做布局檢查參與者放不下或消息間距過密會直接報(bào)錯而不是給你一張壞圖。對時(shí)序圖sequence而言它專門負(fù)責(zé)誰在什么時(shí)候調(diào)用了誰主請求路徑、返回、鑒權(quán)、異步旁路各占一種視覺風(fēng)格延遲與可觀測性開銷在圖上自然分離。Archify 是什么五類圖表一份自包含 HTML一句話定位Archify 是從語義到像素的確定性編譯管線——自然語言或 Mermaid 輸入 → Agent 推斷空間關(guān)系 → JSON IR Schema 校驗(yàn) → 類型化渲染器 布局規(guī)則檢查 → 獨(dú)立 HTML 多倍率導(dǎo)出。能力清單五種圖表類型architecture誰和誰相連、workflow流程分支、sequence調(diào)用時(shí)序、dataflow數(shù)據(jù)流動、lifecycle狀態(tài)機(jī)輸出物單一 HTML 文件內(nèi)嵌 SVG深淺色主題可選 trace 動畫導(dǎo)出 PNG/靜態(tài)圖/WebM/社交分享卡質(zhì)量門禁validate 探索期校驗(yàn)、deliver 交付期終檢showcase 級別要求 0 錯誤 0 警告適配環(huán)境Node.js 渲染與校驗(yàn)系統(tǒng)適配 Cursor、Claude Code、Codex CLI、OpenCode安裝 Archify 技能裝完先說這一句話安裝是一行命令npx skills add tt-a1i/archify -g裝完的第一句話可以直接這樣說Use archify to trace this API request with a cache miss. Agent 會按技能路由表選擇sequence類型并產(chǎn)出 JSON 源文件。不想裝、只想試一次也可以用npx skills use tt-a1i/archifyarchify --agent codex跑一回合。拿不準(zhǔn)該用哪種圖時(shí)問內(nèi)置場景指南node bin/archify.mjs guide 展示帶 Redis 緩存未命中的 API 請求 --json --lang zh它會推薦圖表類型并返回配方。注意配方只是參考圖要由你親手描述業(yè)務(wù)而不是機(jī)械套模板。讀一張緩存缺失時(shí)序圖7 個(gè)參與者、3 個(gè)分段、12 條消息倉庫里有個(gè)教科書級示例源文件在 archify/examples/cache-miss-request.sequence.json渲染成品是 examples/sequence-cache-miss-request.html。時(shí)間從上往下流7 個(gè)參與者橫向排開User → Web App → API → Auth → Redis → Postgres → Trace。整條鏈被 3 個(gè)分段切成三幕分段發(fā)生了什么關(guān)鍵消息Request用戶打開頁面Web App 發(fā)請求API 完成鑒權(quán)GET /dashboard、verify JWT、claims okFallbackAPI 讀 Redis 發(fā)現(xiàn) miss回源 Postgres 查詢r(jià)ead cache、miss、query profile metrics、rowsResponse trace寫回緩存、異步上報(bào) trace、響應(yīng)回到前端set cache、emit trace、200 JSON、render圖例把消息風(fēng)格分成五類每類在圖上有明確的戲份emphasis主請求路徑用強(qiáng)調(diào)色是視線第一落點(diǎn)return返回消息安靜克制不搶正向調(diào)用的風(fēng)頭security鑒權(quán)類調(diào)用單獨(dú)著色一眼定位安全交互dashed異步/非阻塞示例里set cache和emit trace兩條紫色虛線絕不壓過主鏈default常規(guī)交互無特殊語義時(shí)默認(rèn)使用。激活條activations表示參與者的忙碌時(shí)段Postgres 只有一小段激活條直觀說明回源窗口很短Auth 的激活條只覆蓋鑒權(quán)窗口。這套約定寫在 archify/renderers/sequence/README.md 里。四步描述法把一條 API 調(diào)用鏈寫成 JSON時(shí)序圖源文件是一份帶類型的 JSON IR字段約束以 sequence.schema.json 為準(zhǔn)。按四步寫每步都有最小示例可參照緩存缺失示例的對應(yīng)塊。第 1 步參與者。列出鏈路上每個(gè)角色給id、語義typefrontend/backend/database/security 等和標(biāo)簽{ id: redis, type: database, label: Redis, sublabel: cache }第 2 步消息。按時(shí)間順序?qū)懨織l箭頭指定from、to、垂直坐標(biāo)y和風(fēng)格variant{ id: cache-miss, from: redis, to: api, label: miss, variant: return }第 3 步分段與激活條。用segments的from/toy 像素區(qū)間把時(shí)間線切成 2–3 幕再給關(guān)鍵參與者加activations忙碌時(shí)段。第 4 步命名章節(jié)可選。在meta.views里配最多 5 個(gè)命名章節(jié)每章聲明focus參與者列表用于成品里的分章講解再開animation: trace讓箭頭按調(diào)用順序逐段點(diǎn)亮。緩存缺失示例配了 3 章Request and identity、Cache fallback、Return and trace。寫完就走管線。渲染器內(nèi)置校驗(yàn)器無需裝依賴node archify/renderers/sequence/render-sequence.mjs cache-miss-request.sequence.json output.html交付階段兩條命令收口node bin/archify.mjs validate sequence cache-miss-request.sequence.json --quality showcase --json node bin/archify.mjs deliver sequence cache-miss-request.sequence.json examples/sequence-cache-miss-request.htmldeliver會把規(guī)格文件字節(jié)級凍結(jié)成快照再渲染輸出 HTML 附帶 SHA-256 回執(zhí)——你分享給同事的那一個(gè)文件和它背后的 JSON 對得上。交付后再跑node bin/archify.mjs visual-check output.html --json在 1440×900 到 2048×1320 多檔桌面分辨率下確認(rèn)不溢出。核心原則始終是布局有問題就報(bào)錯絕不畫出一張壞圖。更多字段約定見 archify/references/authoring-contract.md 與中文 authoring-cookbook。打開成品 HTML分章播放、路由追蹤與換你自己的項(xiàng)目用瀏覽器打開渲染好的 HTML它不是一張靜態(tài)圖分章講解Guided views頂部 3 個(gè)章節(jié)按鈕逐章聚焦相關(guān)參與者Play story自動按調(diào)用順序點(diǎn)亮整條鏈路由追蹤Route probe選中 Web App 到 Postgres 的路徑面板顯示3 nodes · 2 directed hops · shortest authored route可復(fù)制深鏈或?qū)С?1200×630 的路由分享卡片主題與導(dǎo)出右上角切換 Deep 深淺色Export 菜單支持復(fù)制 PNG 到剪貼板、下載靜態(tài)圖、WebM 運(yùn)動格式和社交分享卡。現(xiàn)在把示例換成你自己的系統(tǒng)落地清單就四步列出這條請求鏈的參與者網(wǎng)關(guān)、鑒權(quán)、緩存、主庫……語義type各歸其位按時(shí)間順序?qū)懴⒅髀窂接胑mphasis返回用return鑒權(quán)用security旁路埋點(diǎn)用dashed用 2–3 個(gè) segment 切分時(shí)間線給關(guān)鍵服務(wù)加激活條跑 validate → deliver → visual-check多檔分辨率確認(rèn)不溢出。7 個(gè)參與者、3 個(gè)分段、不到 100 行 JSON一條完整的 API 調(diào)用鏈就講完了。畫得好看、畫得正確這兩件難事由 Archify 兜底你只需要講清楚業(yè)務(wù)本身?！久赓M(fèi)下載鏈接】archifyAgent skill for beautiful, verifiable architecture, workflow, sequence,>項(xiàng)目地址: https://gitcode.com/GitHub_Trending/arch/archify創(chuàng)作聲明：本文部分內(nèi)容由AI輔助生成（AIGC），僅供參考 Archify 實(shí)操：一張時(shí)序圖講清緩存缺失的 API 調(diào)用鏈
Archify 實(shí)操一張時(shí)序圖講清緩存缺失的 API 調(diào)用鏈【免費(fèi)下載鏈接】archifyAgent skill for beautiful, verifiable architecture, workflow, sequence,>項(xiàng)目地址: https://gitcode.com/GitHub_Trending/arch/archify排查這次請求為什么慢時(shí)日志給你的是碎片而一張時(shí)序圖給你的是因果。Archify 是一個(gè)面向 AI Agent 的圖表技能把代碼庫或一段系統(tǒng)描述編譯成五種可驗(yàn)證的交互式圖表——架構(gòu)圖、工作流圖、時(shí)序圖、數(shù)據(jù)流圖、生命周期圖產(chǎn)物是一份帶動畫、可多倍率導(dǎo)出的自包含 HTML。下面用官方緩存缺失請求示例把這條鏈路從寫、到驗(yàn)、到講給人看完整走一遍。排查一次變慢的請求從一張能講清楚的圖開始設(shè)想這個(gè)場景用戶打開儀表盤頁面接口比平時(shí)慢了 300ms。你要給同事講清楚錢花在哪請求經(jīng)過幾跳、鑒權(quán)花了多久、緩存是命中還是缺失、回源數(shù)據(jù)庫的窗口有多短?？陬^講容易丟細(xì)節(jié)Mermaid 手畫又常常畫錯、畫丑最后還得截圖貼文檔。Archify 的思路是把畫圖拆成兩半語義由你和 Agent 描述空間布局與美觀交給渲染器兜底。你只寫一份帶類型的 JSON IR渲染器按 schema 嚴(yán)格校驗(yàn)、做布局檢查參與者放不下或消息間距過密會直接報(bào)錯而不是給你一張壞圖。對時(shí)序圖sequence而言它專門負(fù)責(zé)誰在什么時(shí)候調(diào)用了誰主請求路徑、返回、鑒權(quán)、異步旁路各占一種視覺風(fēng)格延遲與可觀測性開銷在圖上自然分離。Archify 是什么五類圖表一份自包含 HTML一句話定位Archify 是從語義到像素的確定性編譯管線——自然語言或 Mermaid 輸入 → Agent 推斷空間關(guān)系 → JSON IR Schema 校驗(yàn) → 類型化渲染器 布局規(guī)則檢查 → 獨(dú)立 HTML 多倍率導(dǎo)出。能力清單五種圖表類型architecture誰和誰相連、workflow流程分支、sequence調(diào)用時(shí)序、dataflow數(shù)據(jù)流動、lifecycle狀態(tài)機(jī)輸出物單一 HTML 文件內(nèi)嵌 SVG深淺色主題可選 trace 動畫導(dǎo)出 PNG/靜態(tài)圖/WebM/社交分享卡質(zhì)量門禁validate 探索期校驗(yàn)、deliver 交付期終檢showcase 級別要求 0 錯誤 0 警告適配環(huán)境Node.js 渲染與校驗(yàn)系統(tǒng)適配 Cursor、Claude Code、Codex CLI、OpenCode安裝 Archify 技能裝完先說這一句話安裝是一行命令npx skills add tt-a1i/archify -g裝完的第一句話可以直接這樣說Use archify to trace this API request with a cache miss. Agent 會按技能路由表選擇sequence類型并產(chǎn)出 JSON 源文件。不想裝、只想試一次也可以用npx skills use tt-a1i/archifyarchify --agent codex跑一回合。拿不準(zhǔn)該用哪種圖時(shí)問內(nèi)置場景指南node bin/archify.mjs guide 展示帶 Redis 緩存未命中的 API 請求 --json --lang zh它會推薦圖表類型并返回配方。注意配方只是參考圖要由你親手描述業(yè)務(wù)而不是機(jī)械套模板。讀一張緩存缺失時(shí)序圖7 個(gè)參與者、3 個(gè)分段、12 條消息倉庫里有個(gè)教科書級示例源文件在 archify/examples/cache-miss-request.sequence.json渲染成品是 examples/sequence-cache-miss-request.html。時(shí)間從上往下流7 個(gè)參與者橫向排開User → Web App → API → Auth → Redis → Postgres → Trace。整條鏈被 3 個(gè)分段切成三幕分段發(fā)生了什么關(guān)鍵消息Request用戶打開頁面Web App 發(fā)請求API 完成鑒權(quán)GET /dashboard、verify JWT、claims okFallbackAPI 讀 Redis 發(fā)現(xiàn) miss回源 Postgres 查詢r(jià)ead cache、miss、query profile metrics、rowsResponse trace寫回緩存、異步上報(bào) trace、響應(yīng)回到前端set cache、emit trace、200 JSON、render圖例把消息風(fēng)格分成五類每類在圖上有明確的戲份emphasis主請求路徑用強(qiáng)調(diào)色是視線第一落點(diǎn)return返回消息安靜克制不搶正向調(diào)用的風(fēng)頭security鑒權(quán)類調(diào)用單獨(dú)著色一眼定位安全交互dashed異步/非阻塞示例里set cache和emit trace兩條紫色虛線絕不壓過主鏈default常規(guī)交互無特殊語義時(shí)默認(rèn)使用。激活條activations表示參與者的忙碌時(shí)段Postgres 只有一小段激活條直觀說明回源窗口很短Auth 的激活條只覆蓋鑒權(quán)窗口。這套約定寫在 archify/renderers/sequence/README.md 里。四步描述法把一條 API 調(diào)用鏈寫成 JSON時(shí)序圖源文件是一份帶類型的 JSON IR字段約束以 sequence.schema.json 為準(zhǔn)。按四步寫每步都有最小示例可參照緩存缺失示例的對應(yīng)塊。第 1 步參與者。列出鏈路上每個(gè)角色給id、語義typefrontend/backend/database/security 等和標(biāo)簽{ id: redis, type: database, label: Redis, sublabel: cache }第 2 步消息。按時(shí)間順序?qū)懨織l箭頭指定from、to、垂直坐標(biāo)y和風(fēng)格variant{ id: cache-miss, from: redis, to: api, label: miss, variant: return }第 3 步分段與激活條。用segments的from/toy 像素區(qū)間把時(shí)間線切成 2–3 幕再給關(guān)鍵參與者加activations忙碌時(shí)段。第 4 步命名章節(jié)可選。在meta.views里配最多 5 個(gè)命名章節(jié)每章聲明focus參與者列表用于成品里的分章講解再開animation: trace讓箭頭按調(diào)用順序逐段點(diǎn)亮。緩存缺失示例配了 3 章Request and identity、Cache fallback、Return and trace。寫完就走管線。渲染器內(nèi)置校驗(yàn)器無需裝依賴node archify/renderers/sequence/render-sequence.mjs cache-miss-request.sequence.json output.html交付階段兩條命令收口node bin/archify.mjs validate sequence cache-miss-request.sequence.json --quality showcase --json node bin/archify.mjs deliver sequence cache-miss-request.sequence.json examples/sequence-cache-miss-request.htmldeliver會把規(guī)格文件字節(jié)級凍結(jié)成快照再渲染輸出 HTML 附帶 SHA-256 回執(zhí)——你分享給同事的那一個(gè)文件和它背后的 JSON 對得上。交付后再跑node bin/archify.mjs visual-check output.html --json在 1440×900 到 2048×1320 多檔桌面分辨率下確認(rèn)不溢出。核心原則始終是布局有問題就報(bào)錯絕不畫出一張壞圖。更多字段約定見 archify/references/authoring-contract.md 與中文 authoring-cookbook。打開成品 HTML分章播放、路由追蹤與換你自己的項(xiàng)目用瀏覽器打開渲染好的 HTML它不是一張靜態(tài)圖分章講解Guided views頂部 3 個(gè)章節(jié)按鈕逐章聚焦相關(guān)參與者Play story自動按調(diào)用順序點(diǎn)亮整條鏈路由追蹤Route probe選中 Web App 到 Postgres 的路徑面板顯示3 nodes · 2 directed hops · shortest authored route可復(fù)制深鏈或?qū)С?1200×630 的路由分享卡片主題與導(dǎo)出右上角切換 Deep 深淺色Export 菜單支持復(fù)制 PNG 到剪貼板、下載靜態(tài)圖、WebM 運(yùn)動格式和社交分享卡。現(xiàn)在把示例換成你自己的系統(tǒng)落地清單就四步列出這條請求鏈的參與者網(wǎng)關(guān)、鑒權(quán)、緩存、主庫……語義type各歸其位按時(shí)間順序?qū)懴⒅髀窂接胑mphasis返回用return鑒權(quán)用security旁路埋點(diǎn)用dashed用 2–3 個(gè) segment 切分時(shí)間線給關(guān)鍵服務(wù)加激活條跑 validate → deliver → visual-check多檔分辨率確認(rèn)不溢出。7 個(gè)參與者、3 個(gè)分段、不到 100 行 JSON一條完整的 API 調(diào)用鏈就講完了。畫得好看、畫得正確這兩件難事由 Archify 兜底你只需要講清楚業(yè)務(wù)本身?！久赓M(fèi)下載鏈接】archifyAgent skill for beautiful, verifiable architecture, workflow, sequence,>項(xiàng)目地址: https://gitcode.com/GitHub_Trending/arch/archify創(chuàng)作聲明：本文部分內(nèi)容由AI輔助生成（AIGC），僅供參考