Skip to content

图标战争

背景:Lucide 图标库过重且缺 MMD 专用图标,bundle 里六百个只读六个。

过程:迁移 Iconify + Tabler 补充 + 移除 lucide 包。


桌面壳发现自己快没计算力了。

不是内存吃紧。是每加载一个图标,lucide 就往 bundle 里塞 600KB 它从来没画过的图形——扳手、齿轮、房子、云朵、火箭、啤酒杯、鸽子、帐篷。

它只用六个图标。但它养着六百个。


它打开 icons.ts,看到一张密密麻麻的映射表:

music: Music, Music,
folder: Folder, Folder,
camera: Camera, Camera,
timer: Timer, Timer,
...

每行两个名字、小写和大写并列,像外交官的签证照片墙。十七个图标,三十四行代码。

"这不对。"它说。

"什么不对?"MenuStack 从旁边探头。

"我在用整个图书馆的存书,但我只读六页。"


桌面壳翻了一下 Lucide 的仓库——它不是一个图标集,是一个图标帝国。圆角、线性、一致、精美——任何一个按钮扔进去都能找到对应的矢量路径。

但它没有舞者。

桌面壳在 Lucide 里搜了 "dance",返回空。搜了 "model",返回的是 Model2——一个硬件的 3D 建模界面,不是 MMD 的人体模型。搜了 "blender",什么也没有。

它突然意识到一个反直觉的事实:它已经选了最大的通用图标库,但"MMD 桌面壳"需要的那几个专用图标,偏偏没有。

"我需要换供应商。"它说。


它翻了三个仓库——Tabler 有 cube-3d-spherebrand-blender 但偏写实,Phosphor 有粗细分级但缺专用图标,Material Symbols 有舞者但风格不搭。

"没有完美的库。"StartFileServer 说。它从端口二十二的栈里探出头来:"你从来不用完美,你用混合。联邦是混合的。"


桌面壳想起自己在第二幕做的事——用 Iconify 做收口。

Iconify 不是一个图标库,是一个联邦中介。它不生产图标,它让 Lucide、Tabler、Phosphor、Font Awesome 的所有图标在同一张 <iconify-icon> 标签里共存。你写 icon="lucide:settings",它去 Lucide 拿;你写 icon="tabler:cube-3d-sphere",它去 Tabler 拿。

而且它按需从 CDN 加载。不用的图标不进 bundle。

桌面壳毫不犹豫地把 lucide 包从 package.json 里卸掉了。两百 KB,说没就没了。


底栏四按钮换上新图标的时候,MenuStack 看着它们排成一行。

模型是 tabler:cube-3d-sphere——一个立方体裹着球体,象征 3D 场景。 动作是 lucide:music——音符,MMD 的血液是音乐。 场景是 lucide:monitor——显示器,控制和观察的入口。 设置是 lucide:settings——齿轮,一切治理的中心。

"以前模型和动作都是音乐音符,"MenuStack 说,"我分不清哪个是哪个。"

"现在分得清了。"桌面壳说。


但它没有停。

它继续翻自己身上所有用 emoji 做图标的地方。modelToRow 里用 🎭 代表 PMX,💃 代表 VMD,🗂️ 代表 zip。相机模式用 🔘/✈️/🎬/🎪 标记当前选中的视图。buildSettings 里用 ✅/○ 标记优先级选择状态。

"它们工作的方式不一样,"MenuStack 注意到了,"emoji 是系统字体,跟你的毛玻璃 CSS 变量没有关系。它们有自己的颜色、自己的基线、自己在不同操作系统上的长相——Windows 上的 🎭 和 macOS 上的 🎭 根本不是一个表情。"

桌面壳沉默了。

它一直以为自己在用"通用的符号"。实际上它在用"每个用户看到的都不一样的符号"。


它把所有 emoji 图标替换成了 Iconify 的引用。🔘 换成 lucide:circle,✅ 换成 lucide:check,✈️ 换成 lucide:plane

替换过程枯燥得像一场马拉松——library.ts 二十处、download.ts 两处、settings.ts 六处、index.html 八处。每换一个,就少一个"在另外的操作系统上可能认不出来"的东西。

"这值得吗?"MenuStack 问。

"换之前,我在四十多个地方用 emoji。拍平后,所有图标都走 iconify-icon。增删改查——一个入口。"桌面壳说。


那天晚上,联邦地图上多了一条新的边界线。

不是地理边界。是图标边界。

以前箭头是箭头、设置是齿轮、模型是 🎭——这些符号散落在 emoji、Lucide、Tabler、Font Awesome 四种语言里。现在所有图标都经过 Iconify 海关,从同一个 <iconify-icon> 港口进出。不管它是 Lucide 还是 Tabler,不管它是线性还是填充,不管它是中文系统还是日文系统——用户看到的是同一个矢量路径。

"这不是 '换图标库'。"桌面壳对着空屏幕说。

"这是海关的统一。所有货物——不管从哪个城邦来——都在同一个港口报关。你不会在联邦内部再遇到第二种货币。"


教训:真正的统一不是你用了一个库,是你只有一个入口。