Picture gallery 图解集

All 19 figures from the three primers, plus 6 from this demo. Each answers one question, in the same thick-outline hand. 三个读本的 19 张插画，加这页 demo 的 6 张，一次看全。每张都答一个问题，都是同一套厚描边画法。

One handbook, many sheets drawn to it — that is the whole gallery. 一本手册，几张照着它画出的图纸——整个图解集就是这么来的。

Primer 1 · the database index 读本 ① · 数据库索引

This primer explains the database index. All six figures speak one book metaphor. 这个读本讲数据库索引。六张图说同一个书比喻。

FIG 01

一页页翻 flip page by page 直接翻到那一页 jump straight to the page
The hero figure: the same thick book — flipped page by page, or opened straight via the slim booklet. hero 主插画：同一本厚书，左边一页页翻，右边靠小册子直接翻到那一页。

FIG 02

It's like…就像……

The index at the back of a book: sorted entries, each with a page number. You look up the entry, then turn straight to the page. 书后面的索引页：词条按拼音排好，旁边写着页码。先查到页码，再直接翻到那一页。

The analogy card: a back-of-book index — find the page number, then turn straight to it. 比喻卡：书末的索引页——先查页码，再直接翻过去。

FIG 03

书后面的索引页 the back-of-book index 数据库的索引 the database's index 词条 ↔ 值 entry ↔ value 页码 ↔ 行号 page № ↔ row № 索引 the index 原表 the table
The mapping figure: the book's index pairs with the database's. An entry is a value; a page number, a row number. 映射图：书的索引页和数据库的索引一一对上。词条是值，页码是行号。

FIG 04

2000 万行 20,000,000 rows 你要找的那一行 the row you want 一行一秒 one row a second ≈ 七个多月 ≈ seven-plus months
The full scan: at one row a second, 20,000,000 rows take over seven months. 全表扫描：一行一秒翻 2000 万行，要七个多月才翻到你要的那一行。

FIG 05

The three index steps: open the index, halve your way down, fetch the row by number. 走索引三步：翻开索引，一次丢一半，最后按行号取原行。

FIG 06

来了一条新数据 a new row arrives 写两次 written twice 表 · 3GB the table · 3GB 索引 · 300MB index · 300MB
The cost: a 3GB table carries a 300MB index — one tenth — and every insert writes twice. 代价：3GB 的表配约 300MB 的索引，是表的十分之一；每次写入要写两份。

Primer 2 · how a page arrives 读本 ② · 网页怎么来

This primer follows a page load. All seven figures ride one takeout trip. 这个读本讲网页怎么加载。七张图走同一趟外卖。

FIG 07

按下回车 press Enter 页面亮起 the page lights up
The hero figure: from Enter to a lit page in under a second — about one heartbeat. hero 主插画：从按下回车到页面亮起，通常不到一秒——一次心跳的工夫。

FIG 08

It's like…就像……

You order, the kitchen cooks, a rider delivers, you open the door and eat. A web page reaches your screen by the same four steps. 点一份外卖：下单，餐厅做，骑手送，开门就能吃。网页到你屏幕上，走的也是这四步。

The analogy card: takeout at the door — you never went to the restaurant; the meal made the trip. 比喻卡：一份外卖送到门口——你没去餐厅，餐自己走完了全程。

FIG 09

点外卖 ordering takeout 网页送达 the page arriving 下单 ↔ 报网址 order ↔ address 厨房备餐 ↔ 备好文件 cooking ↔ files ready 骑手送 ↔ 文件上路 riding ↔ files travel 开门 ↔ 页面亮 door ↔ page lights
The mapping figure: the takeout trip and the web trip line up stage by stage. 映射图：外卖那一趟和网页那一趟，一段一段对得上。

FIG 10

你记的名字 the name you type 机器用的数字地址 the numeric address machines use 公用的电话本 the shared phone book
Step 1: the shared phone book turns the name into a numeric address — that is DNS. 第 1 步：拿名字去公用电话本查出数字地址——这就是 DNS。

FIG 11

约 2000 公里 ≈ 2,000 km 你的电脑 your computer 服务器 the server
Step 2: the request slip travels 2,000 km in about 0.01 seconds. 第 2 步：请求单送往 2000 公里外，路上只要约 0.01 秒。

FIG 12

文字、图片、按钮，打包发回 text, pictures and buttons, packed and sent back
Step 3: text, pictures and buttons come back — about 2MB, one MP3. 第 3 步：文字、图片、按钮打包发回，一页约 2MB——一首 MP3 的大小。

FIG 13

送来的零件 the delivered pieces 一件件摆上屏幕 placed piece by piece
Step 4: like plating a dish, the browser sets each piece into its slot. 第 4 步：浏览器像摆盘一样，把送来的零件一件件放进页面。

Primer 3 · HTTP vs HTTPS 读本 ③ · HTTP 和 HTTPS

This primer compares HTTP and HTTPS. All six figures mail the same message. 这个读本比较 HTTP 和 HTTPS。六张图寄同一句话。

FIG 14

明信片 · HTTP postcard · HTTP 密封信 · HTTPS sealed · HTTPS
The hero figure: one message mailed twice — a postcard anyone reads, a sealed letter only its receiver opens. hero 主插画：同一句话寄两次——明信片人人能看，密封信只有收件人能拆。

FIG 15

It's like…就像……

Write on a postcard and every pair of hands can read it. Seal it in an envelope and only the receiver can open it. 在明信片背面写话，经手的人都能看到。装进密封信封，就只有收件人拆得开。

The analogy card: two ways to mail — written on a postcard, or sealed in an envelope. 比喻卡：两种寄法——写在明信片上，或封进信封。

FIG 16

寄信那边 in the mail 网页这边 on the web 明信片 ↔ 裸着走 postcard ↔ travels bare 密封信 ↔ 封着走 sealed ↔ travels sealed
The mapping figure: a postcard is a page travelling bare; a sealed letter, one travelling sealed. 映射图：明信片就是裸着走的网页，密封信就是封着走的。

FIG 17

同一条路 the same road 你这边 your side 网站那头 the site's end
What's the same: both ride the same road, at nearly the same speed. 相同处：两种寄法走同一条路，速度也几乎一样。

FIG 18

HTTP HTTPS 路上，能不能被看到？ can it be read en route? 半路，能不能被改？ can it be changed en route?
The difference: en route the postcard can be read and rewritten; the sealed letter shows only gibberish. 不同处：路上一段——明信片看得清、改得动；密封信只见乱码，动过留痕。

FIG 19

点开锁，就能看到证书 click the lock → the certificate
How to tell: the padlock in the address bar is the seal; click it for the certificate. 怎么分辨：地址栏那把锁就是封条，点开能看到网站的证书。

This demo · the Agent Skill 本页 demo · Agent Skill

The demo explains the Agent Skill. All six figures orbit one handbook. 这页 demo 讲 Agent Skill。六张图围着同一本手册。

FIG 20

每天口头交代一遍 told again, every day 写成一本手册 written down once
The hero figure: the same computer — told again every day, or handed a written handbook. hero 主插画：同一台电脑——每天口头交代一遍，或者写成一本手册。

FIG 21

It's like…就像……

The handbook a company hands a new hire: rules and examples inside. Read it first, and nobody has to walk you through. 公司发给新同事的入职手册：规矩和范例都写在里面。先读它，就不用老员工天天带。

The analogy card: the new hire's handbook — read it first, then follow it. 比喻卡：给新同事的入职手册，第一天先读，照着做。

FIG 22

入职手册 the onboarding handbook skill 文件夹 the skill folder 章节 ↔ 规则文件 chapter ↔ rule file 范例页 ↔ 示范页 example ↔ sample page 给新同事 for the new hire 给 AI 助手 for the AI assistant
The mapping figure: the onboarding handbook pairs one-to-one with the skill folder. 映射图：入职手册和 skill 文件夹一一对应。

FIG 23

没有 skill without a skill 有 skill with a skill 每次都不太一样 different every time 每次同一个样子 the same every time
The compare figure: without a skill the results all differ; with one they come out alike. 对照图：没有 skill，三次产出各不相同；有了它，每次同一个样子。

FIG 24

一格文件柜：全部 22 本手册 one cabinet: all 22 handbooks 这 9 本教画页面 these 9 draw pages 另外 13 本教别的 the other 13 teach the rest 画好的范本 · 58 张 finished samples · 58 坑的记录 · 84 条 the pitfall log · 84
The cabinet: all 22 handbooks, 9 for drawing pages, two drawers of samples and pitfalls. 仓库一柜：全部 22 本手册，9 本教画页面，两个抽屉装范本和坑。

FIG 25

做完的一页 the finished page 手册变成的清单 the handbook, as a checklist 全过才交付 all clear — it ships
The machine checks: a finished page is compared line by line; one miss sends it back. 机械检查：做完的页对着清单逐条核对，一条不过就打回。