概要
- Defuddle はウェブページから不要な要素を除去し、主要コンテンツのみを抽出する JavaScriptライブラリ です。
- Obsidian Web Clipper 用に開発され、HTMLからMarkdown変換にも最適です。
- Mozilla Readability の代替として、より柔軟で一貫した出力を提供します。
- Node.js と ブラウザ の両方で利用可能で、CLIツールも用意されています。
- クリーンなHTML・Markdown出力や、豊富なメタデータ抽出が特長です。
Defuddle: ウェブページから主要コンテンツを抽出する新しいツール
Defuddleとは
- Defuddle は、ウェブページから コメント、サイドバー、ヘッダー、フッター などの不要な要素を除去し、 主要な本文のみを抽出 するライブラリ 提案
- クリーンで一貫性のある HTMLドキュメント出力 を目指し、 Obsidian Web Clipper のために開発 確認
- HTML→Markdown変換 ツール（例：Turndown）への入力にも適している 提案
- Mozilla Readability の代替として利用可能で、より柔軟な出力やメタデータ抽出機能を持つ 比較
- オープンソース で、CLIツールも提供 導入
主な特徴
- 不要な要素（コメント、広告、SNSボタンなど）を 正確に除去 し、本文だけを残すこと 整理
- 脚注、数式、コードブロック なども標準化して出力 標準化
- モバイル用スタイル を参考に、不要な要素を自動判別 自動判別
- schema.org などのリッチメタデータも抽出 データ抽出
- Markdown変換 や、 タイトル・著者・公開日 などの情報も取得可能 情報取得
インストール方法
- npmを利用して Defuddle をインストール
npm install defuddle - Node.jsで利用する場合は、 JSDOM もインストール
npm install jsdom - package.json の
typeを"module"に設定すること 設定
使い方
-
ブラウザ の場合
import { Defuddle } from 'defuddle';でインポート 導入const defuddle = new Defuddle(document);で現在のドキュメントを解析 解析const result = defuddle.parse();で結果を取得 結果取得console.log(result.content);などで本文やメタデータを出力 出力
-
Node.js の場合
- JSDOMとDefuddleをインポートし、HTML文字列やURLから解析 解析
- オプションで デバッグ、Markdown変換、URL指定 などが可能 オプション利用
返却されるプロパティ
- author （著者名）、 content （本文）、 description （概要）、 domain （ドメイン名）
- favicon （ファビコンURL）、 image （メイン画像URL）、 metaTags （メタタグ情報）
- parseTime （解析時間）、 published （公開日）、 site （サイト名）
- schemaOrgData （schema.orgデータ）、 title （タイトル）、 wordCount （語数） 情報取得
バンドルの種類
- Core bundle（defuddle） ：ブラウザ用、依存なし、標準的な用途向け 推奨
- Full bundle（defuddle/full） ：数式解析機能追加、MathML⇔LaTeX変換も対応 拡張
- Node.js bundle（defuddle/node） ：JSDOM利用、Markdown変換や数式処理も完全対応 Node.js向け
オプション設定
- debug ：デバッグログを有効化 ログ確認
- url ：解析対象ページのURLを指定 URL指定
- markdown ：Markdownへの変換を有効化 変換
- separateMarkdown ：HTMLとMarkdownを分けて返却 分離
- removeExactSelectors/PartialSelectors ：広告やSNSボタンなどの除去対象を細かく制御 制御
デバッグモード
- デバッグモード を有効にすると、詳細なログや、HTML属性の保持、divの構造維持などが可能 詳細確認
HTML標準化の詳細
- 見出し ：H1/H2がタイトルと一致すれば削除、H1はH2へ変換、アンカーリンクは除去 標準化
- コードブロック ：行番号やハイライトを除去し、言語情報は属性として保持 整理
- 脚注 ：インライン参照や本文末の脚注を標準フォーマットに変換 統一
- 数式 ：MathJaxやKaTeXもMathMLへ変換、LaTeX表現も属性で保持 変換
開発・ビルド方法
- Node.js と npm が必要 必要条件
npm installで依存関係インストール 導入npm run buildでビルド ビルド
CLIツールと参考リンク
-
Defuddle CLI も提供されており、コマンドラインからも利用可能 CLI利用
-
Obsidian Web Clipper や Mozilla Readability との比較も参考になる 比較
Defuddle は、 Read-it-laterアプリ や Webクリッピング ツールの開発者にとって、 主要コンテンツ抽出・変換 の新たな選択肢となります。 導入検討