上周做的自动抠图, 大家反馈没办法指定抠谁
一个模型，想扣谁扣谁。
不用后端，不用 API，浏览器里跑 SAM（46MB），点几下就抠完。
核心代码
import * as ort from "./ort/ort.bundle.min.mjs"
ort.env.wasm.wasmPaths = "./ort/"
const enc = await ort.InferenceSession.create("./models/sam_hq_vit_t_encoder.onnx")
const dec = await ort.InferenceSession.create("./models/sam_hq_vit_t_decoder.onnx")
流程图
浏览器加载 SAM-HQ ONNX（46MB）
│
▼
上传图片 → Encoder 编码（只跑一次）
│
▼
点坐标 → Decoder 推理 → mask
│
▼
输出透明 PNG
1 SAM-HQ 能干嘛
SAM 全称 Segment Anything Model，Meta 出的，约 4.5 万星。
你点一个点，它告诉你哪些像素属于这个物体。
不是猜主体，是你说了算。
SAM-HQ 是改进版，GitHub 约 1.3 万星。
边界更细，头发丝、宠物毛都能抠干净。
ViT-Tiny 版本 encoder + decoder 一共 46MB，浏览器直接跑。
2 ONNX 是 samexporter 转的
SAM-HQ 官方只有 PyTorch 权重，浏览器不认。
我用 samexporter 转成了 ONNX。
这个工具专门导出 SAM 家族：SAM、MobileSAM、SAM2、SAM-HQ 都支持。
一条命令导出 encoder，一条命令导出 decoder。
拆两个文件的好处：encoder 编码一次，decoder 反复用。
转好的文件放在 demo 的 static/models/ 下，拿来就用。
3 浏览器推理：onnxruntime-web
微软开源，GitHub 约 1.5 万星。
ONNX 文件放本地，wasm 引擎直接跑推理。
服务器要加两条响应头开多线程，demo 的 index.js 已配好。
4 功能：点哪抠哪
上传图片，自动编码。
左键点主体，右键点背景，点几下模型就明白你要啥。
界面上紫色叠加，边界看得清清楚楚。
一张图里两个同款商品，只想抠左边那个？
左边点几下，右边点几下排掉，模型自己分边界。
抠完一键下载透明 PNG。
5 性能
-
• 模型加载：2 秒
-
• 首次编码：0.3 秒，一张图只跑一次
-
• 每次点击：0.05 秒，防抖 200ms 批量推理
-
• 纯 CPU 够用，有 WebGPU 还能更快
关键在 embedding 缓存。
编码一次，点十次八次都复用，这是 SAM 快的核心。
6 应用场景
电商：主图换底色，白底图批量出，不用 Photoshop 一张张抠。
隐私：图不出本机，纯浏览器推理，敏感图敢用了。
成本：零服务器，抠图功能直接塞进现有网页。
工具：做个在线设计器，抠图、换背景、拼图一条龙。
最后说两句
ViT-Tiny 是轻量版，头发丝、半透明物体差点意思。
要好效果换 ViT-Base，200MB，浏览器还能扛。
再往上就走服务端，Python 跑 SAM2，多卡伺候。
demo 给原型用，上生产该用大的还得用。
想扣谁扣谁。
坚持不住了, 睡了, 明早见, 不知道这次的效果大家满意了没?
