Files
ai-agent-book/book-en/images/fig5-9.svg
T
liqiang b119135836
Build latest book artifacts / build (push) Canceled after 0s
dependency resolution / resolve (3.11) (push) Canceled after 0s
dependency resolution / resolve (3.13) (push) Canceled after 0s
deploy-pages / build (push) Canceled after 0s
deploy-pages / deploy (push) Canceled after 0s
i18n consistency check / check (push) Canceled after 0s
provider adoption tests / test (chapter2/context-compression) (push) Canceled after 0s
provider adoption tests / test (chapter2/prompt-injection) (push) Canceled after 0s
provider adoption tests / test (chapter2/system-hint) (push) Canceled after 0s
provider adoption tests / test (chapter3/log-sanitization) (push) Canceled after 0s
web-search-agent tests / test (push) Canceled after 0s
web-search-agent tests / agentbook (push) Canceled after 0s
ai-agent-book 精选快照(<2MB 代码与文档,来自 github.com/bojieli/ai-agent-book)
2026-08-20 13:12:50 +00:00

67 lines
11 KiB
XML

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 40 880 540" width="880" height="540" style="background:#ffffff">
<defs><marker id="ah" markerWidth="12" markerHeight="8" refX="12" refY="4" orient="auto"><polygon points="0 0, 12 4, 0 8" fill="#333333"/></marker><marker id="ah-light" markerWidth="12" markerHeight="8" refX="12" refY="4" orient="auto"><polygon points="0 0, 12 4, 0 8" fill="#999999"/></marker></defs>
<rect x="20" y="55" width="840" height="200" rx="6" fill="#ffffff" stroke="#333333" stroke-width="2" stroke-dasharray="8,4"/>
<text x="60" y="78" font-family="Arial, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', sans-serif" font-size="20" fill="#333333" text-anchor="start" dominant-baseline="central" font-weight="bold">Traditional mode: data passes through LLM (inefficient)</text>
<rect x="770" y="65" width="80" height="24" rx="12" fill="#999999" stroke="#333333" stroke-width="2"/>
<text x="810.0" y="77.0" font-family="Arial, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', sans-serif" font-size="12" fill="#ffffff" text-anchor="middle" dominant-baseline="central" font-weight="bold">✗ Inefficient</text>
<rect x="60" y="100" width="130" height="60" rx="6" fill="#d0d0d0" stroke="#333333" stroke-width="2"/>
<text x="125" y="118" font-family="Arial, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', sans-serif" font-size="16" fill="#333333" text-anchor="middle" dominant-baseline="central" font-weight="bold">User</text>
<text x="125" y="138" font-family="Arial, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', sans-serif" font-size="7" fill="#666666" text-anchor="middle" dominant-baseline="central" font-weight="normal">&quot;Number of people per department?&quot;</text>
<line x1="190" y1="130" x2="210" y2="130" stroke="#333333" stroke-width="2" marker-end="url(#ah)"/>
<rect x="215" y="100" width="130" height="60" rx="6" fill="#f0f0f0" stroke="#333333" stroke-width="2"/>
<text x="280" y="118" font-family="Arial, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', sans-serif" font-size="16" fill="#333333" text-anchor="middle" dominant-baseline="central" font-weight="bold">LLM</text>
<text x="280" y="138" font-family="Arial, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', sans-serif" font-size="14" fill="#666666" text-anchor="middle" dominant-baseline="central" font-weight="normal">Generate SQL</text>
<line x1="345" y1="130" x2="365" y2="130" stroke="#333333" stroke-width="2" marker-end="url(#ah)"/>
<rect x="370" y="100" width="130" height="60" rx="6" fill="#d0d0d0" stroke="#333333" stroke-width="2"/>
<text x="435" y="118" font-family="Arial, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', sans-serif" font-size="16" fill="#333333" text-anchor="middle" dominant-baseline="central" font-weight="bold">DB</text>
<text x="435" y="138" font-family="Arial, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', sans-serif" font-size="14" fill="#666666" text-anchor="middle" dominant-baseline="central" font-weight="normal">Execute </text>
<text x="435" y="154" font-family="Arial, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', sans-serif" font-size="14" fill="#666666" text-anchor="middle" dominant-baseline="central" font-weight="normal"> query</text>
<line x1="500" y1="130" x2="520" y2="130" stroke="#333333" stroke-width="2" marker-end="url(#ah)"/>
<rect x="525" y="100" width="130" height="60" rx="6" fill="#f0f0f0" stroke="#333333" stroke-width="2"/>
<text x="590" y="118" font-family="Arial, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', sans-serif" font-size="16" fill="#333333" text-anchor="middle" dominant-baseline="central" font-weight="bold">LLM</text>
<text x="590" y="138" font-family="Arial, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', sans-serif" font-size="14" fill="#666666" text-anchor="middle" dominant-baseline="central" font-weight="normal">Read </text>
<text x="590" y="154" font-family="Arial, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', sans-serif" font-size="14" fill="#666666" text-anchor="middle" dominant-baseline="central" font-weight="normal"> 5000 lines</text>
<line x1="655" y1="130" x2="675" y2="130" stroke="#333333" stroke-width="2" marker-end="url(#ah)"/>
<rect x="680" y="100" width="130" height="60" rx="6" fill="#d0d0d0" stroke="#333333" stroke-width="2"/>
<text x="745" y="118" font-family="Arial, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', sans-serif" font-size="16" fill="#333333" text-anchor="middle" dominant-baseline="central" font-weight="bold">User</text>
<text x="745" y="138" font-family="Arial, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', sans-serif" font-size="14" fill="#666666" text-anchor="middle" dominant-baseline="central" font-weight="normal">Text </text>
<text x="745" y="154" font-family="Arial, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', sans-serif" font-size="14" fill="#666666" text-anchor="middle" dominant-baseline="central" font-weight="normal"> description</text>
<rect x="60" y="175" width="760" height="30" rx="3" fill="#f5f5f5" stroke="#999999" stroke-width="2"/>
<text x="70" y="190" font-family="'Courier New', Courier, monospace" font-size="12" fill="#333333" text-anchor="start" dominant-baseline="central">Problem: LLM copying data is error-prone · consumes many tokens · high latency</text>
<line x1="30" y1="265" x2="850" y2="265" stroke="#999999" stroke-width="2" stroke-dasharray="8,4"/>
<rect x="20" y="275" width="840" height="280" rx="6" fill="#ffffff" stroke="#333333" stroke-width="2" stroke-dasharray="8,4"/>
<text x="60" y="298" font-family="Arial, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', sans-serif" font-size="20" fill="#333333" text-anchor="start" dominant-baseline="central" font-weight="bold">Artifact mode: data directly to frontend (efficient)</text>
<rect x="770" y="285" width="80" height="24" rx="12" fill="#d0d0d0" stroke="#333333" stroke-width="2"/>
<text x="810.0" y="297.0" font-family="Arial, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', sans-serif" font-size="12" fill="#333333" text-anchor="middle" dominant-baseline="central" font-weight="bold">✓ Efficient</text>
<rect x="40" y="315" width="250" height="120" rx="6" fill="#f0f0f0" stroke="#333333" stroke-width="2"/>
<text x="165" y="335" font-family="Arial, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', sans-serif" font-size="16" fill="#333333" text-anchor="middle" dominant-baseline="central" font-weight="bold">LLM only generates code</text>
<rect x="50" y="345" width="230" height="92" rx="3" fill="#f5f5f5" stroke="#999999" stroke-width="2"/>
<text x="58" y="358" font-family="'Courier New', Courier, monospace" font-size="10" fill="#333333" text-anchor="start" dominant-baseline="central">build_artifact(</text>
<text x="58" y="372" font-family="'Courier New', Courier, monospace" font-size="10" fill="#333333" text-anchor="start" dominant-baseline="central"> type=&quot;sql&quot;,</text>
<text x="58" y="386" font-family="'Courier New', Courier, monospace" font-size="10" fill="#333333" text-anchor="start" dominant-baseline="central"> code=&quot;SELECT dept,</text>
<text x="58" y="400" font-family="'Courier New', Courier, monospace" font-size="10" fill="#333333" text-anchor="start" dominant-baseline="central"> COUNT(*) as cnt</text>
<text x="58" y="414" font-family="'Courier New', Courier, monospace" font-size="10" fill="#333333" text-anchor="start" dominant-baseline="central"> FROM employees</text>
<text x="58" y="428" font-family="'Courier New', Courier, monospace" font-size="10" fill="#333333" text-anchor="start" dominant-baseline="central"> GROUP BY dept&quot;)</text>
<line x1="290" y1="380" x2="340" y2="380" stroke="#333333" stroke-width="2" marker-end="url(#ah)"/>
<rect x="340" y="315" width="250" height="120" rx="6" fill="#d0d0d0" stroke="#333333" stroke-width="2"/>
<text x="465" y="335" font-family="Arial, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', sans-serif" font-size="16" fill="#333333" text-anchor="middle" dominant-baseline="central" font-weight="bold">Frontend executes directly</text>
<rect x="350" y="348" width="230" height="75" rx="3" fill="#f5f5f5" stroke="#999999" stroke-width="2"/>
<text x="358" y="360" font-family="'Courier New', Courier, monospace" font-size="9" fill="#333333" text-anchor="start" dominant-baseline="central">┌────────┬──────┐</text>
<text x="358" y="372" font-family="'Courier New', Courier, monospace" font-size="9" fill="#333333" text-anchor="start" dominant-baseline="central">│ dept │ cnt │</text>
<text x="358" y="384" font-family="'Courier New', Courier, monospace" font-size="9" fill="#333333" text-anchor="start" dominant-baseline="central">├────────┼──────┤</text>
<text x="358" y="396" font-family="'Courier New', Courier, monospace" font-size="9" fill="#333333" text-anchor="start" dominant-baseline="central">│ R&amp;D Dept │ 42 │</text>
<text x="358" y="408" font-family="'Courier New', Courier, monospace" font-size="9" fill="#333333" text-anchor="start" dominant-baseline="central">│ Marketing Dept │ 28 │</text>
<text x="358" y="420" font-family="'Courier New', Courier, monospace" font-size="9" fill="#333333" text-anchor="start" dominant-baseline="central">└────────┴──────┘</text>
<line x1="590" y1="380" x2="640" y2="380" stroke="#333333" stroke-width="2" marker-end="url(#ah)"/>
<rect x="640" y="315" width="210" height="120" rx="6" fill="#f0f0f0" stroke="#333333" stroke-width="2"/>
<text x="745" y="335" font-family="Arial, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', sans-serif" font-size="16" fill="#333333" text-anchor="middle" dominant-baseline="central" font-weight="bold">Visualization Artifact</text>
<text x="745" y="355" font-family="Arial, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', sans-serif" font-size="14" fill="#666666" text-anchor="middle" dominant-baseline="central" font-weight="normal">Second artifact:</text>
<rect x="650" y="365" width="190" height="60" rx="3" fill="#f5f5f5" stroke="#999999" stroke-width="2"/>
<text x="658" y="380" font-family="'Courier New', Courier, monospace" font-size="10" fill="#333333" text-anchor="start" dominant-baseline="central">build_artifact(</text>
<text x="658" y="394" font-family="'Courier New', Courier, monospace" font-size="10" fill="#333333" text-anchor="start" dominant-baseline="central"> type=&quot;chart&quot;,</text>
<text x="658" y="408" font-family="'Courier New', Courier, monospace" font-size="10" fill="#333333" text-anchor="start" dominant-baseline="central"> code=&quot;bar(data)&quot;)</text>
<rect x="180" y="450" width="520" height="45" rx="6" fill="#999999" stroke="#333333" stroke-width="2"/>
<text x="440" y="465" font-family="Arial, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', sans-serif" font-size="15.5" fill="#ffffff" text-anchor="middle" dominant-baseline="central" font-weight="bold">Data flow: DB → Frontend → Visualization (completely bypasses LLM)</text>
<text x="440" y="483" font-family="Arial, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', sans-serif" font-size="14" fill="#ffffff" text-anchor="middle" dominant-baseline="central" font-weight="normal">LLM is only responsible for generating code, not for data transfer</text>
<path d="M 465,435 Q 605.0,460.0 745,435" fill="none" stroke="#999999" stroke-width="2" stroke-dasharray="8,4" marker-end="url(#ah-light)"/>
</svg>