【免费下载链接】dsh-genuiGenUI for DeepSeek Harness: interactive UI components rendered inline in assistant replies via the dsh-ui fence — layout, charts, plots, forms, quizzes, mermaid, 3D scenes, and an action event loop back to the model. Ships the fence-teaching host plugin, the browser renderer (client half), and the genui skill.项目地址https://gitcode.com/gh_mirrors/ds/dsh-genui点击查看免费下载dsh-genui 是运行在 DeepSeek Harness 中的生成式 UIGenUI插件它能在助手回复里直接渲染图表、表单、测验等交互组件。其中很少有人注意到的是它内置的一套749 个字形、按需加载的图标系统常用图标随客户端包内联秒开冷门图标首次用到时才拉取约 1 MB 的全量字形包拼错的图标名则降级为一个中性圆点——不报错、不丢块、不浪费流量。这篇文章带你完整看懂它的分层设计与生成管线。30 秒上手icon 节点怎么用在dsh-ui围栏里图标就是展示类词汇表里的一个普通节点{type:icon,name:Sparkles,tone:info,size:24,tile:true}name图标名区分大小写可取 ICON-NAMES.md 中列出的任意一个名字tone语义色info/success/warning/danger/muted/default通过 CSS 变量currentColor着色size16 / 20 / 24 / 32其他值会自动吸附到最近档tile加一个淡色圆角方底适合做阶段卡、语义标记完整说明见 SKILL.md 中「组件词汇」一节的icon条目。图标渲染入口是 src/client/blocks/icon.tsx它把解析到的 SVG 路径直接画进对话流里。两级加载64 个内联685 个按需图标系统的核心权衡写在 src/client/icons/icon-lazy.ts 的注释里一个未知字形不该让所有读者付出 1 MB 的代价一个拼错的名字更不该付出任何代价。具体拆成三层数据文件内容发布方式icon-data.ts64 个高频字形状态、箭头、计算/文档类内联进客户端包同步命中icon-data-full.ts全量 749 个字形打成lib/assets/icons.js不进入主包icon-names-full.ts749 个规范名只有名字没有路径数据内联进客户端包查找逻辑在 src/client/icons/icon-lazy.ts 的isKnownIcon/resolveIcon中先查内联表再查已下载的全量表。名字在全量表里但路径数据还没下载时节点先画一个中性圆点同时触发 ensureIcons 一次性加载加载完成后通过订阅回调把所有已挂载的圆点批量替换为真实字形——整页只下载一次且由 src/client/asset-loader.ts 的 Promise 记忆化保证不重复请求。为什么是 749 个而不是更多这套字形来自 OpenAI Apps SDK UI 图标集MIT固定 commit由 scripts/generate-icon-data.mjs 直接解析上游 TSX 源文件生成版权信息记录在 THIRD_PARTY_NOTICES.md。生成器对「可忠实渲染」把关很严只接受path/rect/circle/ellipse/line/polyline/polygon这类扁平图形遇到g分组、clipPath等嵌套结构会整图排除而非静默丢弃部分路径——最终剔除了 6 个字形Document、Linear 等其余 749 个全部保留。被排除的名字会明确列在 ICON-NAMES.md 顶部绝不悄悄消失。忠实度有测试兜底tests/genui-icon-fidelity.spec.tsx 逐个校验描边是否未填充、根级 stroke 是否正确继承、SettingsCircle的角标是否还在原来位置、SidebarMenuMobileBadgeCutout的蓝色徽章颜色是否保持#0285FF——上游改了样式测试立刻报警。拼错图标名会发生什么这是这套设计里最实用的一点icon.name是模型能随意填写的字符串。渲染器用Object.hasOwn做存在性判断src/client/icons/icon-lazy.ts避免constructor、toString这类名字误命中原型链。结果就是三种干净的分支内联命中→ 同步渲染零等待名字真实但未下载→ 圆点占位 触发一次全量下载 → 自动补画名字不在 749 个名单里拼错、幻觉→ 永远只是中性圆点不触发任何网络请求对以 AI 生成 UI 为核心的 dsh-genui 来说这意味着模型偶尔写错图标名也绝不会让整块围栏崩掉。相关文件速查图标节点渲染src/client/blocks/icon.tsx两级查找与加载src/client/icons/icon-lazy.ts内联字形 / 全量字形 / 名字清单src/client/icons/资产加载器一次下载、拒绝记忆化src/client/asset-loader.ts生成脚本与图标名清单scripts/generate-icon-data.mjs、ICON-NAMES.md上游版权THIRD_PARTY_NOTICES.md一句话总结64 个内联换秒开685 个按需换轻量749 个全保真拼错只赔一个圆点——这就是 dsh-genui 图标系统的完整答案。赞分享【免费下载链接】dsh-genuiGenUI for DeepSeek Harness: interactive UI components rendered inline in assistant replies via the dsh-ui fence — layout, charts, plots, forms, quizzes, mermaid, 3D scenes, and an action event loop back to the model. Ships the fence-teaching host plugin, the browser renderer (client half), and the genui skill.项目地址https://gitcode.com/gh_mirrors/ds/dsh-genui点击查看免费下载相关推荐ant-design-vue-pro图标系统详解自定义图标与按需加载ant design vue pro图标系统详解自定义图标与按需加载 在现代前端开发中图标系统是用户界面不可或缺的组成部分。ant design vue p前端企业应用认证鉴权国际化G-Helper AMD 降压教程Ryzen 笔记本降温省电性能几乎不损失G Helper AMD 降压教程Ryzen 笔记本降温省电性能几乎不损失 G Helper 的 AMD CPU 降压功能可以把 Ryzen 处理器的供电桌面应用Bilibili-Evolved终极SVG图标系统自定义图标与按需加载完整指南Bilibili Evolved终极SVG图标系统自定义图标与按需加载完整指南 Bilibili Evolved作为强大的哔哩哔哩增强脚本其SVG图标系统提前端上一篇突破手势识别瓶颈MediaPipe模型路径配置与多手势处理全方案下一篇JS Confetti性能优化让五彩纸屑动画流畅运行在任何设备创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 
长河君 · 2026/10/29 10:22:45 · 阅读 1.2k 749 个可忠实渲染的图标：dsh-genui 图标系统与按需加载机制揭秘
【免费下载链接】dsh-genuiGenUI for DeepSeek Harness: interactive UI components rendered inline in assistant replies via the dsh-ui fence — layout, charts, plots, forms, quizzes, mermaid, 3D scenes, and an action event loop back to the model. Ships the fence-teaching host plugin, the browser renderer (client half), and the genui skill.项目地址https://gitcode.com/gh_mirrors/ds/dsh-genui点击查看免费下载dsh-genui 是运行在 DeepSeek Harness 中的生成式 UIGenUI插件它能在助手回复里直接渲染图表、表单、测验等交互组件。其中很少有人注意到的是它内置的一套749 个字形、按需加载的图标系统常用图标随客户端包内联秒开冷门图标首次用到时才拉取约 1 MB 的全量字形包拼错的图标名则降级为一个中性圆点——不报错、不丢块、不浪费流量。这篇文章带你完整看懂它的分层设计与生成管线。30 秒上手icon 节点怎么用在dsh-ui围栏里图标就是展示类词汇表里的一个普通节点{type:icon,name:Sparkles,tone:info,size:24,tile:true}name图标名区分大小写可取 ICON-NAMES.md 中列出的任意一个名字tone语义色info/success/warning/danger/muted/default通过 CSS 变量currentColor着色size16 / 20 / 24 / 32其他值会自动吸附到最近档tile加一个淡色圆角方底适合做阶段卡、语义标记完整说明见 SKILL.md 中「组件词汇」一节的icon条目。图标渲染入口是 src/client/blocks/icon.tsx它把解析到的 SVG 路径直接画进对话流里。两级加载64 个内联685 个按需图标系统的核心权衡写在 src/client/icons/icon-lazy.ts 的注释里一个未知字形不该让所有读者付出 1 MB 的代价一个拼错的名字更不该付出任何代价。具体拆成三层数据文件内容发布方式icon-data.ts64 个高频字形状态、箭头、计算/文档类内联进客户端包同步命中icon-data-full.ts全量 749 个字形打成lib/assets/icons.js不进入主包icon-names-full.ts749 个规范名只有名字没有路径数据内联进客户端包查找逻辑在 src/client/icons/icon-lazy.ts 的isKnownIcon/resolveIcon中先查内联表再查已下载的全量表。名字在全量表里但路径数据还没下载时节点先画一个中性圆点同时触发 ensureIcons 一次性加载加载完成后通过订阅回调把所有已挂载的圆点批量替换为真实字形——整页只下载一次且由 src/client/asset-loader.ts 的 Promise 记忆化保证不重复请求。为什么是 749 个而不是更多这套字形来自 OpenAI Apps SDK UI 图标集MIT固定 commit由 scripts/generate-icon-data.mjs 直接解析上游 TSX 源文件生成版权信息记录在 THIRD_PARTY_NOTICES.md。生成器对「可忠实渲染」把关很严只接受path/rect/circle/ellipse/line/polyline/polygon这类扁平图形遇到g分组、clipPath等嵌套结构会整图排除而非静默丢弃部分路径——最终剔除了 6 个字形Document、Linear 等其余 749 个全部保留。被排除的名字会明确列在 ICON-NAMES.md 顶部绝不悄悄消失。忠实度有测试兜底tests/genui-icon-fidelity.spec.tsx 逐个校验描边是否未填充、根级 stroke 是否正确继承、SettingsCircle的角标是否还在原来位置、SidebarMenuMobileBadgeCutout的蓝色徽章颜色是否保持#0285FF——上游改了样式测试立刻报警。拼错图标名会发生什么这是这套设计里最实用的一点icon.name是模型能随意填写的字符串。渲染器用Object.hasOwn做存在性判断src/client/icons/icon-lazy.ts避免constructor、toString这类名字误命中原型链。结果就是三种干净的分支内联命中→ 同步渲染零等待名字真实但未下载→ 圆点占位 触发一次全量下载 → 自动补画名字不在 749 个名单里拼错、幻觉→ 永远只是中性圆点不触发任何网络请求对以 AI 生成 UI 为核心的 dsh-genui 来说这意味着模型偶尔写错图标名也绝不会让整块围栏崩掉。相关文件速查图标节点渲染src/client/blocks/icon.tsx两级查找与加载src/client/icons/icon-lazy.ts内联字形 / 全量字形 / 名字清单src/client/icons/资产加载器一次下载、拒绝记忆化src/client/asset-loader.ts生成脚本与图标名清单scripts/generate-icon-data.mjs、ICON-NAMES.md上游版权THIRD_PARTY_NOTICES.md一句话总结64 个内联换秒开685 个按需换轻量749 个全保真拼错只赔一个圆点——这就是 dsh-genui 图标系统的完整答案。赞分享【免费下载链接】dsh-genuiGenUI for DeepSeek Harness: interactive UI components rendered inline in assistant replies via the dsh-ui fence — layout, charts, plots, forms, quizzes, mermaid, 3D scenes, and an action event loop back to the model. Ships the fence-teaching host plugin, the browser renderer (client half), and the genui skill.项目地址https://gitcode.com/gh_mirrors/ds/dsh-genui点击查看免费下载相关推荐ant-design-vue-pro图标系统详解自定义图标与按需加载ant design vue pro图标系统详解自定义图标与按需加载 在现代前端开发中图标系统是用户界面不可或缺的组成部分。ant design vue p前端企业应用认证鉴权国际化G-Helper AMD 降压教程Ryzen 笔记本降温省电性能几乎不损失G Helper AMD 降压教程Ryzen 笔记本降温省电性能几乎不损失 G Helper 的 AMD CPU 降压功能可以把 Ryzen 处理器的供电桌面应用Bilibili-Evolved终极SVG图标系统自定义图标与按需加载完整指南Bilibili Evolved终极SVG图标系统自定义图标与按需加载完整指南 Bilibili Evolved作为强大的哔哩哔哩增强脚本其SVG图标系统提前端上一篇突破手势识别瓶颈MediaPipe模型路径配置与多手势处理全方案下一篇JS Confetti性能优化让五彩纸屑动画流畅运行在任何设备创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考