Spaces:
Running
Running
| <html lang="zh-CN"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |
| <title>录匣 Offlisten · 离线会议转写</title> | |
| <style> | |
| :root { | |
| --bg: #23272c; | |
| --panel: #1b1e22; | |
| --line: #343a41; | |
| --fg: #e8eaed; | |
| --dim: #9aa4ae; | |
| --accent: #f5c542; | |
| } | |
| * { box-sizing: border-box; } | |
| html { background: var(--bg); } | |
| body { | |
| margin: 0; | |
| background: var(--bg); | |
| color: var(--fg); | |
| font: 16px/1.7 -apple-system, "Segoe UI", "Helvetica Neue", "PingFang SC", "Microsoft YaHei", sans-serif; | |
| -webkit-font-smoothing: antialiased; | |
| } | |
| main { max-width: 760px; margin: 0 auto; padding: 64px 24px 96px; } | |
| header { border-bottom: 1px solid var(--line); padding-bottom: 28px; margin-bottom: 36px; } | |
| h1 { font-size: 30px; line-height: 1.25; margin: 0 0 6px; letter-spacing: -0.01em; } | |
| .en { color: var(--dim); font-size: 15px; margin: 0; } | |
| h2 { font-size: 17px; margin: 44px 0 12px; font-weight: 600; } | |
| p { margin: 0 0 14px; } | |
| .lead { font-size: 18px; line-height: 1.65; } | |
| .lead strong { color: var(--accent); font-weight: 600; } | |
| .note { color: var(--dim); font-size: 14px; } | |
| a { color: var(--accent); text-decoration: none; border-bottom: 1px solid rgba(245,197,66,.35); } | |
| a:hover { border-bottom-color: var(--accent); } | |
| .tablewrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 8px; } | |
| table { border-collapse: collapse; width: 100%; font-size: 14px; } | |
| th, td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--line); vertical-align: top; } | |
| th { background: var(--panel); font-weight: 600; color: var(--dim); white-space: nowrap; } | |
| tr:last-child td { border-bottom: 0; } | |
| td.num { font-variant-numeric: tabular-nums; white-space: nowrap; } | |
| td.out { font-size: 13px; } | |
| th .thsub { font-weight: 400; font-size: 13px; color: var(--dim); } | |
| td .rng { font-size: 13px; color: var(--dim); } | |
| video { width: 100%; border: 1px solid var(--line); border-radius: 8px; background: #000; display: block; } | |
| .videohint { | |
| border: 1px dashed var(--line); border-radius: 8px; padding: 28px 20px; | |
| text-align: center; color: var(--dim); font-size: 14px; | |
| } | |
| code { background: var(--panel); border: 1px solid var(--line); border-radius: 4px; padding: 1px 5px; font-size: 13px; } | |
| h3 { font-size: 15px; margin: 26px 0 10px; font-weight: 600; color: var(--dim); } | |
| blockquote { | |
| margin: 0 0 14px; padding: 10px 14px; border-left: 2px solid var(--accent); | |
| background: var(--panel); font-size: 14px; line-height: 1.7; | |
| } | |
| footer { margin-top: 56px; padding-top: 20px; border-top: 1px solid var(--line); color: var(--dim); font-size: 13px; } | |
| ul { padding-left: 20px; margin: 0 0 14px; } | |
| li { margin-bottom: 6px; } | |
| figure { margin: 0 0 10px; background: #fff; border-radius: 8px; padding: 10px; } | |
| figure img { display: block; width: 100%; height: auto; } | |
| figure a { display: block; border-bottom: 0; } | |
| /* 矩阵图是 1000px 宽的信息图，正文栏只有 712px：宽屏时让它出血，字才看得清 */ | |
| @media (min-width: 960px) { | |
| figure { margin-left: -90px; margin-right: -90px; } | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <main> | |
| <header> | |
| <h1>录匣 Offlisten</h1> | |
| <p class="en">100% offline speech-to-text for meetings and lectures.</p> | |
| </header> | |
| <p class="lead"> | |
| 录匣把你电脑上的声音转成文字，全部在本机完成。 | |
| <strong>没有账号，没有云端，拔掉网线它还在写。</strong> | |
| </p> | |
| <p> | |
| 下面是同一份模型（SenseVoice int8，2 个 CPU 线程）在五段公开音频上的真实输出，看完再决定要不要装。 | |
| 这个页面不放可交互 demo：转写要在服务端加载 229 MiB 的模型，而它的主场是你自己的电脑。 | |
| </p> | |
| <h2>五个语种，同一份模型</h2> | |
| <div class="tablewrap"> | |
| <table> | |
| <thead> | |
| <tr><th>音频</th><th>时长</th><th>耗时</th><th>RTF<br><span class="thsub">5 轮中位数</span></th><th>输出</th></tr> | |
| </thead> | |
| <tbody> | |
| <tr><td><a href="https://huggingface.co/ToothpasteLake/offlisten-models/resolve/main/test_wavs/zh.wav">中</a></td><td class="num">5.6 s</td><td class="num">0.56 s</td><td class="num">0.100<br><span class="rng">0.087–0.117</span></td><td class="out">开饭时间早上9点至下午5点。</td></tr> | |
| <tr><td><a href="https://huggingface.co/ToothpasteLake/offlisten-models/resolve/main/test_wavs/en.wav">英</a></td><td class="num">7.2 s</td><td class="num">0.59 s</td><td class="num">0.083<br><span class="rng">0.077–0.090</span></td><td class="out">The tribal chieftain called for the boy and presented him with 50 pieces of code.</td></tr> | |
| <tr><td><a href="https://huggingface.co/ToothpasteLake/offlisten-models/resolve/main/test_wavs/ja.wav">日</a></td><td class="num">7.2 s</td><td class="num">0.65 s</td><td class="num">0.090<br><span class="rng">0.080–0.108</span></td><td class="out">うちの中学は弁当制で持っていきない場合は、50円の学校販売のパンを買う。</td></tr> | |
| <tr><td><a href="https://huggingface.co/ToothpasteLake/offlisten-models/resolve/main/test_wavs/ko.wav">韩</a></td><td class="num">4.6 s</td><td class="num">0.38 s</td><td class="num">0.082<br><span class="rng">0.080–0.087</span></td><td class="out">조금만 생각을 하면서 살면 훨씬 편할 거야.</td></tr> | |
| <tr><td><a href="https://huggingface.co/ToothpasteLake/offlisten-models/resolve/main/test_wavs/yue.wav">粤</a></td><td class="num">5.1 s</td><td class="num">0.42 s</td><td class="num">0.081<br><span class="rng">0.078–0.099</span></td><td class="out">呢几个字都表达唔到我想讲嘅意思。</td></tr> | |
| </tbody> | |
| </table> | |
| </div> | |
| <p class="note" style="margin-top:12px"> | |
| 点语种名可以听那段音频。五段都在 | |
| <a href="https://huggingface.co/ToothpasteLake/offlisten-models/tree/main/test_wavs">模型仓库的 test_wavs/</a>， | |
| 和模型一样可下载，可自己复跑。耗时是 2 个 CPU 线程跑五轮的中位数，括号里是极值。 | |
| <br> | |
| 同一段音频连跑五次，RTF 能落在 0.077–0.117 之间，所以这张表只支撑一个结论：速度大概是实时的十倍。 | |
| 要当 benchmark 用，得固定机器、关掉后台、多跑几轮看分布。 | |
| <br> | |
| 中文那句在官方示例里是「开放时间」，int8 量化后这里是「开饭时间」。我们没有换成好看的那条。 | |
| </p> | |
| <h2>演示</h2> | |
| <video id="demo" controls preload="metadata" src="./demo.mp4" hidden></video> | |
| <p class="videohint" id="demo-hint">演示视频加载中；若浏览器不支持 mp4，可直接<a href="./demo.mp4">下载观看</a>。</p> | |
| <p class="note"> | |
| 这 42 秒是按真实时钟跑出来的：五段音频先被模型听完，字幕才依次出现，切段方式和产品里一样靠停顿。 | |
| 界面是产品的本地文本页，以只读回放模式启动，所以控制区写着「只读文本页」；正常桌面运行时那里是开始／暂停。 | |
| 视频里的数据只走过 <code>127.0.0.1</code>。 | |
| </p> | |
| <h2>接上本地的 AI</h2> | |
| <p> | |
| 录匣只把声音变成文字。总结、追问、翻译交给谁写由你决定，前提是那个模型也在这台机器上。 | |
| 下面这段 46 秒没有音轨，因为它要证明的不是听感。 | |
| </p> | |
| <video controls preload="metadata" src="./use-with-browser-ai.mp4"></video> | |
| <p class="note" style="margin-top:12px"> | |
| 左边是录匣的本地文本页，右边是浏览器里的 Page Assist，接着一个跑在 Ollama 上的 <code>qwen2.5:0.5b</code>。 | |
| 勾选 <b>Chat with current page</b> 之后，插件读的是这个页面本身，走的不是云端接口，也不经过复制粘贴。 | |
| </p> | |
| <h3>本地文本页本来就留了这个出口</h3> | |
| <p>页面上那行提示是为这件事写的：</p> | |
| <blockquote> | |
| 文本来自本机离线 ASR，只在 127.0.0.1 上传输。本页不调用任何模型，也不持有 apikey。 | |
| 要交给 AI 处理，就复制全文，或让你浏览器里已有的 AI 插件读取本页。 | |
| </blockquote> | |
| <p>视频里三个部件都在同一台机器上，链路没有一处出网：</p> | |
| <div class="tablewrap"> | |
| <table> | |
| <thead><tr><th>部件</th><th>作用</th><th>跑在哪</th></tr></thead> | |
| <tbody> | |
| <tr><td>SenseVoice int8</td><td>声音转成带标点的文字</td><td class="out">本机进程，229 MiB 随安装包落盘</td></tr> | |
| <tr><td>Page Assist</td><td>把当前页内容放进提示词</td><td class="out">浏览器扩展</td></tr> | |
| <tr><td>Ollama + qwen2.5:0.5b</td><td>读文字，给回答</td><td class="out">本机进程，监听 127.0.0.1:11434</td></tr> | |
| </tbody> | |
| </table> | |
| </div> | |
| <p class="note" style="margin-top:12px"> | |
| 两点说明。一是 <code>0.5b</code> 只有五亿参数，回答质量按小模型的标准看，别拿它和云端大模型比。 | |
| 二是视频里它用英文作答，因为页面上并排摆着中文原文和 Argos 译文，模型看到的是双语文本； | |
| 想让回答更稳，可以在插件里限定「只依据中文原文回答」。 | |
| </p> | |
| <h2>造轮子之前，先看这 12 格</h2> | |
| <p> | |
| 上面演示的是产品选中的那一格。选之前量过 4 个运行时 × 3 个平台， | |
| 能同时满足「CPU 能跑、流式、能装进别人的机器」的只有 2 格，其中 1 格有本机实测。 | |
| </p> | |
| <figure> | |
| <a href="./matrix-zh.png" title="点开看原尺寸 1000×780"><img src="./matrix-zh.png" alt="端侧 ASR 运行时可用性矩阵：4 个运行时 × 3 个平台，12 格里只有 2 格通过"></a> | |
| </figure> | |
| <p class="note"> | |
| 颜色越深越可用。斜纹表示这一格不存在：不是慢，是没有这个选项。 | |
| 英文版：<a href="./matrix-en.png">matrix-en.png</a>。 | |
| </p> | |
| <p> | |
| 图上只放结论，依据分四级：5 格来自官方文档或包矩阵，1 格是本机实测（就是上面那张表）， | |
| 1 格只验过模型、没跑过运行时，5 格是推断。推断的那 5 格标了 L3，只能当「值得试」，不能当结论引用。 | |
| </p> | |
| <h3>依据都能点开核</h3> | |
| <ul> | |
| <li><a href="https://arxiv.org/abs/2407.04051">FunAudioLLM 论文（arXiv:2407.04051）</a>：SenseVoice-Small 的结构、5 语言支持与低延迟声明。</li> | |
| <li><a href="https://k2-fsa.github.io/sherpa/onnx/">sherpa-onnx 文档</a>：ONNX Runtime 下的 SenseVoice 用法与流式示例，产品走的就是这条。</li> | |
| <li><a href="https://k2-fsa.github.io/sherpa/ncnn/sense-voice/">sherpa-ncnn 的 SenseVoice 章</a>：ncnn 侧有现成预训练包，也有麦克风实时识别一节。</li> | |
| <li><a href="https://docs.nvidia.com/deeplearning/triton-inference-server/user-guide/docs/backend/docs/backend_platform_support_matrix.html">Triton 后端支持矩阵</a>：TensorRT 在 x86 与 ARM-SBSA 上都是 GPU ✓ / CPU ✗。</li> | |
| <li><a href="https://pypi.org/project/sherpa-ncnn/#files">PyPI 上 sherpa-ncnn 的 wheel 列表</a>：只有 win32 与 win_amd64，没有 win_arm64。</li> | |
| <li><a href="https://huggingface.co/FunAudioLLM/SenseVoiceSmall-GGUF">SenseVoiceSmall-GGUF 模型卡</a>：q8 体积，8 线程 8.01% CER（184 条普通话）。</li> | |
| </ul> | |
| <p class="note"> | |
| 逐格原因、证据分级和「补一格」用的模板在仓库的 <code>docs/bench/README.md</code>。 | |
| 这 12 格里我们只量过 1 格，剩下 11 格要等有机器的人把数补上。 | |
| </p> | |
| <h2>和云端转写比</h2> | |
| <ul> | |
| <li><b>不上传</b>：音频不出本机。没有隐私政策需要读，因为没有服务器收它。</li> | |
| <li><b>不用登录</b>：没有账号体系，也就没有订阅和额度。</li> | |
| <li><b>断网可用</b>：模型随安装包落盘，拔掉网线照常写。</li> | |
| <li><b>能抓桌面客户端</b>：系统级音频采集，不只限于浏览器标签页。</li> | |
| </ul> | |
| <h2>模型</h2> | |
| <p> | |
| 本页数字对应的权重公开在 | |
| <a href="https://huggingface.co/ToothpasteLake/offlisten-models">ToothpasteLake/offlisten-models</a>， | |
| 6 个文件共 229.07 MiB，逐文件 sha256 登记在发行清单里。换成自己的机器复跑时，先核对哈希，再比数字。 | |
| </p> | |
| <!-- 主仓库公开后取消注释： | |
| <p>源码、契约文档与负结果册：<a href="https://github.com/peaceaddpaasion/Offlisten">github.com/peaceaddpaasion/Offlisten</a></p> | |
| --> | |
| <footer> | |
| 录匣 Offlisten · 本地运行，不上传，不联网 | |
| </footer> | |
| </main> | |
| <script> | |
| (function () { | |
| var v = document.getElementById('demo'); | |
| var hint = document.getElementById('demo-hint'); | |
| v.addEventListener('loadedmetadata', function () { | |
| v.hidden = false; | |
| hint.hidden = true; | |
| }); | |
| v.addEventListener('error', function () { | |
| hint.innerHTML = '演示视频加载失败，可直接<a href="./demo.mp4">下载观看</a>。'; | |
| }); | |
| })(); | |
| </script> | |
| </body> | |
| </html> | |