从 Shadertoy / B站视频 / 自有原型中提取并实现的网页着色器集成展示。每条都附完整算法提取说明、可交互运行、6 步可分解演示(适用时)。所有实现都是单文件、零依赖、可重现。
catalog.json 注册 ④ 主页加入口。详见 vislab/_lib/catalog.json → conventions。| 技术栈 | WebGL2 + GLSL ES 3.00 + 单文件 HTML,零第三方依赖。 |
| 路径规范 | homepage/vislab/<slug>/index.html + 算法提取说明.md |
| HUD 壳层 | 标题 / FPS / 分辨率 / 步骤名 / 控制提示 — 黑色半透明 + 等宽字体(建议统一) |
| 错误显示 | 全局 #err 覆盖层,编译失败时显示完整 GLSL 错误文本(不出现空白屏) |
| 响应式 | DPR 上限 2;resize 重建画布;移动端按 FPS 档位或像素填充率降级 |
| 点击安全 | HUD 与按钮必须真实可点(不许在 HUD 上覆不可点击层;地图 SDK 是高发陷阱) |
| 部署 | 本地 curl 127.0.0.1:<port>/<slug>/ 先实测,再 SFTP 到 /opt/homepage/vislab/<slug>/ |
| 回滚 | rsync --backup(按日期生成 .bak_vislab_YYYYMMDD) |
| 关联 URL | 主页 / → 卡片 /vislab/ → 算法页 /vislab/<slug>/ |