可视化规则编辑器原型

[Ink-lotus]

可视化规则编辑器原型 - 寻求反馈与协作兴趣

---

概述

我们一直在为 MiSub 开发一个可视化规则编辑器，允许用户通过拖放卡片界面来构建代理规则，而不是手动编辑配置文本。这目前是我们 fork 中的工作原型，我们想分享给社区，看看大家是否对这个方向感兴趣。

这不是功能请求 - 我们已经在本地实现了。分享的目的是：

1. 从维护者和用户那里获得反馈
2. 了解是否有兴趣将此能力上游化
3. 讨论潜在的协作方式

---

功能介绍

核心概念

传统方式需要手动编辑规则：

ruleset=🎮 游戏,https://raw.githubusercontent.com/.../Steam.list
ruleset=📺 流媒体,[]DOMAIN-SUFFIX,netflix.com

使用可视化编辑器，用户可以：

• 浏览卡片目录：包含 68+ 个预配置规则源（基于 ACL4SSR）
• 将卡片拖入优先级桶：代理 / 直连 / 广告拦截等
• 实时验证：冲突、缺失来源、兼容性警告
• 应用到模板：支持 Clash、Surge、Loon、QuantumultX、Egern、sing-box

关键特性

• 基于优先级的布局：规则按执行顺序组织到桶中
• 卡片层级：大卡片可包含小卡片（如"流媒体"包含"Netflix"、"Disney+"）
• 智能默认值：推荐的桶配置可一键应用
• 多平台：渲染为 6 种不同客户端格式
• 冲突检测：警告规则顺序问题

---

功能截图

界面说明：

左侧 - 卡片目录

• 三个标签页：搜索卡片、数量卡片、整理卡片
• 层级结构：大卡片（如"广告过滤"）包含子卡片（7 个小卡片）
• 68+ 个预配置规则源，分为流媒体、AI 服务、游戏、社交等类别

右侧 - 优先级桶

• 6 个执行顺序桶：DNS 出口 → 前置修正 → 灵活桶 → 广告拦截 → 国际代理 → 全球直连
• 拖放操作区域，显示当前已配置的规则数量
• 底部有"覆网之鱼"等特殊规则

顶部 - 功能区

• 基础策略组、节点选择、手动功能、自动选择等开关
• 地区分组配置

自定义规则

• 支持添加远程 URL 规则集
• 支持添加内联规则卡片

说明：如果维护者感兴趣，我们可以提供演示实例访问或更多截图。

---

技术实现

架构

前端 (Vue 3)
├── 卡片目录系统（68+ 个预配置源）
│   ├── 层级卡片（大卡片包含小卡片）
│   ├── 元数据（图标、描述、源 URL）
│   └── 搜索和过滤
├── 拖放界面 (vuedraggable)
│   ├── 6 个优先级桶
│   ├── 冲突检测
│   └── 实时验证
└── 多平台渲染器
    ├── 序列化（卡片 → 规则行）
    ├── 6 种平台特定渲染器
    └── 兼容性层

后端
├── 规则序列化逻辑
├── 平台特定映射（Clash、Surge、Loon 等）
└── sing-box 规则集托管（ACL4SSR 转换为 JSON）

已解决的挑战

1. sing-box 远程规则集兼容性

• 问题：ACL4SSR 提供 .list（Surge 格式），但 sing-box 只接受 JSON/SRS
• 方案：实现了构建期转换：.list → sing-box JSON 格式
• 结果：68 个规则集被转换并与应用一起托管

2. 规则优先级和执行顺序

• 问题：用户常犯优先级错误（如将 DIRECT 规则放在 Proxy 之前）
• 方案：可视化布局直接映射到规则执行顺序
• 结果：防止常见错误，提供清晰的执行顺序提示

3. 跨平台一致性

• 问题：不同客户端的规则格式差异大
• 方案：同一个可视化配置为 6 个不同平台生成正确输出
• 结果：平台特定的怪癖在渲染器中处理

---

当前状态

• ✅ 可用：用户可以创建、编辑和应用规则配置
• ✅ 多平台：支持 Clash、Surge、Loon、QuantumultX、Egern、sing-box
• ✅ 已测试：使用真实配置进行本地部署
• ⚠️ 原型质量：UI/UX 可改进，需要更多真实世界反馈

---

给维护者的问题

我们很想听听你们的想法：

1. 对这个功能方向是否感兴趣？

• 是否认为可视化规则编辑是 MiSub 的有价值补充？
• 是否有我们应该解决的特定顾虑或要求？

2. 上游化方式

• 如果感兴趣，贡献的首选方式是什么？
• 作为大型 PR 提交？增量功能分支？带集成的独立仓库？

3. 范围和方向

• 是否应该可选（高级用户仍可编辑文本）？
• 有哪些必备功能或必须避免的约束？

4. sing-box 特定挑战

• 我们必须为 sing-box 兼容性构建规则集转换管道
• 是否有兴趣专门在这方面合作？
• 或者我们应该探索更好的方法？

---

我们的可用性

背景：我们目前在处理多个项目，这就是为什么我们将其作为原型而非完善的 PR 分享。但是：

• ✅ 如果有共同兴趣，我们可以协作特定方面
• ✅ 我们可以提供架构和实现的指导
• ⚠️ 我们无法承诺全职开发或立即的大型重构
• ✅ 我们愿意进行增量贡献，以适应双方的精力

---

仓库与演示

我们的 fork：[MiSub]

如果你想试用，我们可以提供：

• 演示实例访问
• 设置说明
• 视频演示

---

欢迎反馈

这是一个讨论的开始，不是要求或期望。我们真的很好奇：

• 用户想要这个吗？
• 维护者认为这个方向有价值吗？
• 有没有我们应该考虑的替代方法？

期待你们的想法！

---

相关：我们还在提交一个单独的 issue，包含安全和质量审查发现。这些是独立的工作。