Defuddle：Obsidian 创始人打造的网页内容提取利器，9K+ Star 的 Readability 替代方案
前言
当你想把一篇网页文章存进笔记、喂给 AI、或归档到 RSS 阅读器时，最头疼的不是下载——而是把广告、侧边栏、评论区全部剥干净，只留正文。
Mozilla 的 Readability.js 曾是这个领域的标杆，驱动了 Firefox 的阅读模式长达十余年。但随着 Web 技术演进，Readability 的更新越来越慢，策略趋于保守，对现代网页的提取效果逐渐力不从心。
Defuddle正是为填补这个空白而生的。
一、Defuddle 是什么？
Defuddle 是由Steph Ango（kepano）——知识管理工具Obsidian的创始人——亲自开发的开源项目。他在开发 Obsidian Web Clipper 浏览器插件时发现：现有的内容提取库要么不够准确，要么输出格式不理想，于是决定自己写一个。
一句话概括：从网页中提取正文内容和元数据，输出干净的 HTML 或 Markdown。
截至 2026 年 8 月，GitHub 已收获9,100+ Star，MIT 开源协议，TypeScript 编写。
| 项目 | 数据 |
|---|---|
| GitHub | https://github.com/kepano/defuddle |
| Stars | 9,122 |
| 语言 | TypeScript |
| 协议 | MIT |
| 创建时间 | 2025 年 2 月 |
| 最近更新 | 2026 年 8 月 |
二、能做什么？
Defuddle 的核心能力可以概括为 5 点：
| 能力 | 说明 |
|---|---|
| 智能识别正文 | 通过评分算法分析每个 HTML 元素，判断哪些是正文、哪些是噪音 |
| 清除干扰元素 | 广告、导航栏、侧边栏、页脚、Cookie 提示——全部自动移除 |
| 提取元数据 | 标题、作者、发布日期、站点名称等关键信息一并提取 |
| 标准化输出 | 将混乱的网页 HTML 转换为结构清晰的 HTML 或 Markdown |
| 保留特殊格式 | 数学公式和脚注完整保留，对学术文章和技术文档特别友好 |
三、核心原理：评分算法
Defuddle 的秘密武器是一套基于启发式规则的评分算法。工作流程如下：
- 遍历 DOM 树：解析网页的 HTML 结构，为每个容器元素打分
- 内容加分：包含大量文字和
<p>标签的元素获得高分——这通常意味着正文 - 链接密度惩罚：如果一个区域内链接占比过高（比如导航栏），分数会被大幅扣减
- 聚类与筛选：高分区域被保留，低分区域被移除
- 输出清洗后的内容：剩余的 HTML 经过标准化处理，转换为最终格式
这套算法与 Readability 的思路相似，但在实现细节和调优策略上有显著差异。Defuddle更激进地拥抱现代 Web 结构，同时利用移动端样式信息来辅助判断内容区域。
开启debug: true模式后，可以看到完整的决策过程：哪些元素被选中（contentSelector）、哪些被移除（removals数组）、每一步评分的细节——对开发者调试非常友好。
四、三种构建模式，按需选择
Defuddle 提供了三种构建变体，适应不同场景：
| 模式 | 导入路径 | 特点 | 适用场景 |
|---|---|---|---|
| Core | defuddle | 最小体积，仅输出 HTML | 对包体积敏感的浏览器环境 |
| Full | defuddle/full | 内置 Markdown 转换 | Web 应用，需要 Markdown 输出 |
| Node | defuddle/node | 支持服务端 DOM 解析 | Node.js 后端、SSR 场景 |
这种设计让你可以精确控制依赖体积：浏览器插件用 Core，笔记工具用 Full，爬虫服务用 Node。
五、5 分钟快速上手
浏览器控制台尝鲜
constDefuddle=(awaitimport('https://cdn.jsdelivr.net/npm/defuddle@0.19.1/+esm')).default;// 直接传 document 对象，不是 HTML 字符串！constparser=newDefuddle(document,{url:location.href});constresult=parser.parse();console.log(result);命令行使用
npx defuddle parse https://example.com/article--markdown终端管道使用
curldefuddle.md/https://example.com/article网页版
直接访问https://defuddle.md/粘贴 URL 即可提取。
六、真实应用场景
场景 1：Obsidian Web Clipper
Defuddle 最知名的用户就是Obsidian Web Clipper——Obsidian 官方浏览器插件。当你浏览网页时点击「剪藏」，背后就是 Defuddle 在提取正文、转换为 Markdown、注入到 Obsidian 笔记库中。
场景 2：RSS 阅读器
很多 RSS 源只提供摘要，全文需要跳转到原站。用 Defuddle 可以在服务端提取全文，为用户提供完整的阅读体验。
场景 3：AI / LLM 上下文准备
大语言模型的上下文窗口寸土寸金。把网页直接喂给 AI，大量 token 浪费在广告和导航上。Defuddle 帮你把内容压缩到只剩精华，让 AI 专注于真正重要的信息。
场景 4：网页归档与知识管理
将网页内容提取后存入本地知识库（如 Obsidian、Logseq），构建属于自己的「第二大脑」。Defuddle 输出的 Markdown 格式天然适合这类工具。
七、与同类工具对比
| 对比项 | Readability.js | Defuddle | Trafilatura |
|---|---|---|---|
| 作者 | Mozilla | Obsidian 创始人 | 学术团队 |
| 语言 | JavaScript | TypeScript | Python |
| 输出格式 | HTML | HTML / Markdown | TXT / Markdown / XML |
| 最新更新 | 较慢 | 活跃 | 中等 |
| 现代 Web 适配 | 保守 | 激进 | 中等 |
| 包体积 | 较大 | 3 种变体可选 | 较大 |
| 浏览器使用 | 原生 | CDN / npm | 不适用 |
八、总结
在信息过载的时代，「从噪音中提取信号」是一项基础能力。Defuddle 用不到 1MB 的体积，提供了一个优雅、高效、可扩展的解决方案。
无论你是知识管理爱好者、RSS 重度用户、还是正在构建 AI 应用的开发者，Defuddle 都值得加入你的工具箱。
资源链接
- GitHub 仓库：https://github.com/kepano/defuddle
- 网页版：https://defuddle.md/
- CDN 引入：https://cdn.jsdelivr.net/npm/defuddle
免责声明：本文内容基于公开资料整理，仅供技术交流参考。
