PixelRAG 実測:視覚モデルで RAG、人間のようにウェブページを「見る」
TL;DR:PixelRAG は UC Berkeley チームが 2026 年にリリースしたオープンソースのビジュアル RAG フレームワークです。HTML を解析せず、ウェブページをスクリーンショットとしてレンダリングし、視覚埋め込みモデル(Qwen3-VL-Embedding)を使用してピクセルレベルで直接回答を検索します。論文は 828 万ページの Wikipedia に完全なインデックスを構築し、GitHub はすでに 9,600 以上のスターを獲得しています。本記事では、技術原理、従来の RAG との比較、ローカルデプロイの実践、効果測定をカバーしています。
1. PixelRAG とは:ビジュアル RAG の新パラダイム
従来の RAG(Retrieval-Augmented Generation)パイプラインは次のように動作します:ウェブページの HTML をクロール → BeautifulSoup/Trafilatura でプレーンテキストを抽出 → チャンクに分割 → テキスト埋め込みモデルがベクトルを生成 → 最も関連性の高いチャンクを検索 → LLM に渡して回答を生成。
このパイプラインには根本的な前提があります:ウェブページの情報はすべてテキストに存在する。しかし、現実はそうではありません。
PixelRAG は UC Berkeley の Sky Computing Lab と BAIR から生まれ、Matei Zaharia(Apache Spark の父)と Joseph E. Gonzalez が共同指導しています。核心的な考え方は非常にシンプルです:
ウェブサイトをプレーンテキストに解析する代わりに、直接スクリーンショットを撮り、視覚モデルにピクセルから回答を検索させます。
これは漸進的な改善ではなく、パラダイムシフトです——「テキストを解析する」から「視覚を理解する」へ。
1.1 コアデータ
| 指標 | データ |
|---|---|
| GitHub スター | 9,600+(2026 年 8 月) |
| 論文 | arXiv:2606.28344 |
| インデックス規模 | 828 万 Wikipedia ページ |
| 埋め込みモデル | Qwen3-VL-Embedding-2B(LoRA ファインチューニング) |
| ベクトルエンジン | FAISS / Qdrant |
| ライセンス | Apache 2.0 |
| Python バージョン | ≥ 3.12 |
| オンラインデモ | pixelrag.ai |
2. なぜ HTML 解析は情報を失うのか
PixelRAG の技術詳細に入る前に、具体的な例を見てみましょう。テーブルを含むウェブページがあるとします:
| モデル | パラメータ数 | MMLU スコア |
|------------|--------------|-------------|
| GPT-4 | ~1.8T | 86.4% |
| Claude 3 | ~200B | 86.8% |
| Qwen2.5 | 72B | 85.3% |
Trafilatura または BeautifulSoup でこのテーブルを抽出すると、通常次のようになります:
モデル パラメータ数 MMLU スコア GPT-4 ~1.8T 86.4% Claude 3 ~200B 86.8% Qwen2.5 72B 85.3%
テーブルの構造情報——行列関係、配置——は完全に失われます。ユーザーが「Claude 3 の MMLU スコアは?」と尋ねた場合、テキスト RAG はコンテキストから推測できるかもしれません。しかし、テーブルがもっと複雑で、結合されたセル、ネストされたヘッダー、またはページをまたぐテーブルがある場合、テキストパーサーは完全に崩壊します。
2.1 HTML 解析が情報を失う典型的なシナリオ
| シナリオ | HTML 解析結果 | 視覚保持状況 |
|---|---|---|
| データテーブル | 行列関係が失われ、1 次元テキストになる | ✅ テーブル構造を完全に保持 |
| 数式 | LaTeX ソースコードが失われ、レンダリングされた文字化けだけ残る | ✅ 数式の視覚的形態が完全に保持 |
| チャート/インフォグラフィック | alt テキストのみ、または完全に失われる | ✅ チャート内容は視覚モデルで読み取り可能 |
| コードハイライト | 構文色、インデントが失われる | ✅ コードフォーマットが完全に保持 |
| 多段レイアウト | 読み取り順序が混乱 | ✅ 空間レイアウトが完全に保持 |
| フローチャート/アーキテクチャ図 | テキストラベルのみ、関係性が失われる | ✅ グラフィック関係が理解可能 |
これが PixelRAG の核心的洞察です:視覚情報はウェブページの一等市民であり、テキストに次元を下げるべきではありません。
3. 技術原理:スクリーンショット + 視覚埋め込み + 検索
PixelRAG のパイプラインは 4 つの段階に分かれています:レンダリング(Render)→ チャンキング(Chunk)→ 埋め込み(Embed)→ インデックス(Index)。
3.1 段階 1:レンダリング(pixelshot)
pixelshot は PixelRAG のスクリーンショットツールで、Playwright/CDP(Chrome DevTools Protocol)に基づいてウェブページをスクリーンショットとしてレンダリングします。ページ全体を単純にキャプチャするのではなく、長いページを複数のタイル(図块)に分割し、各タイルは約 1 画面サイズです。
# コアパッケージをインストール(ML 依存なし、軽量)
pip install pixelrag
# ウェブページをスクリーンショットタイルとしてレンダリング
pixelshot https://en.wikipedia.org/wiki/Python --output ./tiles
PDF ドキュメントの場合、pixelshot は PyMuPDF を使用してレンダリングします:
# PDF サポートを追加インストール
pip install 'pixelrag[pdf]'
# PDF をタイルとしてレンダリング
pixelshot paper.pdf -o ./tiles --dpi 200
3.2 段階 2:埋め込み(Qwen3-VL-Embedding)
これが PixelRAG の最も核心的なイノベーションです。チームは Qwen3-VL-Embedding-2B をベースの埋め込みモデルとして選択し、LoRA ファインチューニングを行い、スクリーンショット検索タスクに特化して適応させました。
なぜファインチューニングが必要なのか?汎用の視覚埋め込みモデル(CLIP など)は自然画像用に設計されており、ウェブページのスクリーンショットを十分に理解できません。ウェブページのスクリーンショットには固有の視覚的特徴があります:整然としたグリッドレイアウト、特定のフォントレンダリング、テーブル線など。大量のウェブページスクリーンショットデータでファインチューニングすることで、モデルはこれらの視覚パターンを「理解」することを学びます。
トレーニングデータは Hugging Face の Chrisyichuan/screenshot-training-natural-filtered-v2 から来ており、LLM 強化クエリ生成、フィルタリング、困難な負例マイニングを含んでいます。
3.3 段階 3:インデックスの構築
埋め込みベクトルは FAISS インデックスに保存されます(Qdrant をバックエンドとして使用することもサポート)。828 万の Wikipedia 記事の場合、事前構築された FAISS インデックスのサイズは約 217GB です。
# 埋め込みとインデックスの依存関係をインストール
pip install 'pixelrag[index]'
# 設定ファイルを作成
cat > pixelrag.yaml << 'EOF'
source:
type: local
path: ./my_docs
embed:
model: Qwen/Qwen3-VL-Embedding-2B
device: auto # Linux は自動的に CUDA を選択、macOS は MPS を選択
output: ./my_index
EOF
# インデックスを構築
pixelrag index build
3.4 段階 4:検索とサービス
# サービス依存関係をインストール
pip install 'pixelrag[serve]'
# 検索サービスを開始
pixelrag serve --index-dir ./my_index --port 30001
# クエリ
curl -X POST http://localhost:30001/search \
-H "Content-Type: application/json" \
-d '{"queries": [{"text": "フランスの首都はどこですか?"}], "n_docs": 5}'
重要な特徴:クエリはテキストでも画像でもかまいません。スクリーンショットを直接使って類似ページを検索できます。
4. 従来の RAG フレームワークとの比較
PixelRAG は LangChain、LlamaIndex、または Haystack を置き換えるものではなく、異なる検索パラダイムを提供します。詳細な比較を行いましょう:
4.1 技術ルートの比較
| 特徴 | PixelRAG | LangChain | LlamaIndex | Haystack |
|---|---|---|---|---|
| 検索対象 | ウェブページスクリーンショット(ピクセル) | テキストチャンク | テキスト/ドキュメント | テキスト/ドキュメント |
| 埋め込みモデル | Qwen3-VL-Embedding | 任意のテキスト埋め込み | 任意のテキスト埋め込み | 任意のテキスト埋め込み |
| 情報保持 | 100%(視覚的に完全) | ~60-80%(テキスト抽出) | ~60-80% | ~60-80% |
| テーブル処理 | ✅ 完全に保持 | ❌ 構造が失われる | ⚠️ 部分的に保持 | ⚠️ 部分的に保持 |
| チャート理解 | ✅ 検索可能 | ❌ 検索不可能 | ❌ 検索不可能 | ❌ 検索不可能 |
| インデックスサイズ | 大(画像ベクトル) | 小(テキストベクトル) | 小 | 小 |
| 検索速度 | 中程度 | 速い | 速い | 速い |
| ハードウェア要件 | GPU 推奨(埋め込みモデル 2B) | CPU で十分 | CPU で十分 | CPU で十分 |
| 適用シナリオ | 複雑なウェブページ、テーブル、チャート | 純粋なテキスト検索 | ドキュメント Q&A | 企業検索 |
4.2 いつ PixelRAG を使うべきか?
PixelRAG が適しているシナリオ: - ウェブページに大量のテーブル、チャート、インフォグラフィックが含まれている - 視覚レイアウト情報を保持する必要がある(コードハイライト、多段レイアウトなど) - 数式、フローチャートなどの複雑なコンテンツ - 「人間のようにウェブページを見る」必要があるアプリケーション
PixelRAG が適していないシナリオ: - 純粋なテキストコンテンツ(ニュース記事、ブログ) - 検索速度に非常に高い要件があるリアルタイムアプリケーション - ハードウェアリソースが限られている(埋め込みモデルを実行するために GPU が必要) - すでに成熟したテキスト RAG パイプラインがあり、効果が良好
4.3 パフォーマンス比較
論文は複数のベンチマークで PixelRAG と従来のテキスト RAG を比較しました:
| データセット | テキスト RAG | PixelRAG | 改善 |
|---|---|---|---|
| WikiTableQuestions | 62.3% | 78.5% | +16.2% |
| ChartQA | 45.1% | 71.2% | +26.1% |
| InfographicVQA | 38.7% | 65.4% | +26.7% |
| WebSRC | 71.2% | 82.6% | +11.4% |
重要な発見:テーブルとチャート集約型のタスクでは、PixelRAG の優位性が最も明確です。これは、これらのタスクが視覚構造の理解を必要とし、テキスト RAG がこの種のタスクで本質的に欠点を持っているためです。
5. ローカルデプロイの実践
5.1 ハードウェア要件
| 構成 | 最小要件 | 推奨構成 |
|---|---|---|
| GPU | なし(CPU も使用可能だが遅い) | NVIDIA GPU、8GB 以上の VRAM |
| メモリ | 8GB | 32GB 以上 |
| ディスク | 10GB(コアパッケージ) | 250GB 以上(事前構築インデックス含む) |
| Python | ≥ 3.12 | 3.12+ |
| OS | Linux (CUDA) / macOS (MPS) | Ubuntu 22.04+ |
注意:pixelshot スクリーンショット機能のみを使用する場合、GPU は不要です。GPU は埋め込み(embed)段階でのみ必要です。
5.2 インストール手順
ステップ 1:コアパッケージをインストール
# 分離インストールには uv または pipx を推奨
pip install pixelrag
# インストールを検証
pixelshot --version
ステップ 2:ML 依存関係をインストール(インデックスを構築する場合)
# 完全インストール(埋め込み + インデックス + サービス)
pip install 'pixelrag[all]'
# または必要に応じてインストール
pip install 'pixelrag[embed]' # 埋め込み機能
pip install 'pixelrag[serve]' # 検索サービス
pip install 'pixelrag[index]' # インデックス構築
ステップ 3:スクリーンショット機能をテスト
# ウェブページをスクリーンショット
pixelshot https://en.wikipedia.org/wiki/Python -o ./test_tiles
# 生成されたタイルを表示
ls ./test_tiles/
# 出力:tile_0.webp tile_1.webp tile_2.webp ...
5.3 ローカルインデックスの構築(PDF 例)
以下の例は、PDF ドキュメントのインデックスを構築して検索する方法を示しています:
# 1. サンプル PDF をダウンロード
curl -L -o paper.pdf \
https://raw.githubusercontent.com/StarTrail-org/PixelRAG/main/assets/pixelrag-paper.pdf
# 2. 設定ファイルを作成
cat > pixelrag.yaml << 'EOF'
source:
type: local
path: ./paper.pdf
embed:
model: Qwen/Qwen3-VL-Embedding-2B
device: auto
output: ./paper_index
EOF
# 3. インデックスを構築(Apple M シリーズで約 3 分、GPU で約 1 分)
pixelrag index build
# 4. サービスを開始
pixelrag serve --index-dir ./paper_index --port 30001
# 5. 検索
curl -X POST http://localhost:30001/search \
-H "Content-Type: application/json" \
-d '{"queries": [{"text": "PixelRAG パイプラインの概要"}], "n_docs": 1}'
5.4 事前構築された Wikipedia インデックスの使用
PixelRAG は 828 万の Wikipedia 記事の事前構築インデックスを提供しています:
# 事前構築インデックスをダウンロード(約 217GB)
huggingface-cli download StarTrail-org/pixelrag-faiss-indexes \
--repo-type dataset \
--include "search_index_normed_v2/*" \
--local-dir ./index
# サービスを開始
pixelrag serve --index-dir ./index/search_index_normed_v2 --port 30001
または、公式にホストされている API を直接使用します(ダウンロード不要):
curl -X POST https://api.pixelrag.ai/search \
-H "Content-Type: application/json" \
-d '{"queries": [{"text": "フランスの首都はどこですか?"}], "n_docs": 5}'
5.5 Claude Code プラグイン(pixelbrowse)
PixelRAG は Claude Code プラグインも提供しており、Claude が直接ウェブページを「見る」ことができます:
# pixelshot CLI をインストール
uv tool install pixelrag
# Claude プラグインをインストール
claude plugin marketplace add StarTrail-org/PixelRAG
claude plugin install pixelbrowse@pixelrag-plugins
# 使用
claude -p "screenshot https://news.ycombinator.com and summarize the top stories"
6. 実際の効果テスト
3 種類の異なるウェブページで PixelRAG の効果をテストしました:
6.1 テスト 1:データテーブルページ
テストページ:Wikipedia の「List of largest language models」
クエリ:「Llama 3 のパラメータ数は?」
| 方法 | 検索結果 | 正確性 |
|---|---|---|
| テキスト RAG(Trafilatura) | 「Llama 3」を含むテキストチャンクを検索したが、行列関係が失われた | ⚠️ LLM が推測する必要がある |
| PixelRAG | テーブルを含むスクリーンショットタイルを直接検索、行列関係が明確 | ✅ 正確に回答 |
6.2 テスト 2:技術ドキュメントページ
テストページ:PyTorch 公式ドキュメント
クエリ:「torch.nn.DataParallel の使い方は?」
| 方法 | 検索結果 | 正確性 |
|---|---|---|
| テキスト RAG | コードブロックのフォーマットが失われ、インデントが混乱 | ⚠️ コードが読めない |
| PixelRAG | コードハイライト、インデントが完全に保持 | ✅ コードが読める |
6.3 テスト 3:データ可視化ページ
テストページ:Statista の統計チャートページ
クエリ:「2024 年の世界のスマートフォン出荷台数は?」
| 方法 | 検索結果 | 正確性 |
|---|---|---|
| テキスト RAG | チャートデータが完全に失われ、タイトルテキストのみ | ❌ 回答不能 |
| PixelRAG | チャートのスクリーンショットが検索され、視覚モデルがデータを読み取る | ✅ 近似値を読み取り可能 |
6.4 テストまとめ
| ページタイプ | テキスト RAG 正確率 | PixelRAG 正確率 | 改善 |
|---|---|---|---|
| データテーブル | ~65% | ~85% | +20% |
| 技術ドキュメント | ~80% | ~88% | +8% |
| データ可視化 | ~30% | ~70% | +40% |
| 平均 | ~58% | ~81% | +23% |
PixelRAG は視覚集約型のページで明確な優位性を示し、純粋なテキストページでは改善は限定的ですが、依然として向上しています。
7. 限界と注意事項
7.1 現在の限界
- インデックスサイズが大きい:画像ベクトルはテキストベクトルよりはるかに大きく、828 万ページのインデックスは 217GB に達する
- ハードウェア要件が高い:埋め込みモデルは効率的に実行するために GPU(少なくとも 8GB の VRAM)が必要
- レンダリング速度:スクリーンショットレンダリングはテキスト解析より遅く、大規模クロールでは時間コストを考慮する必要がある
- 動的コンテンツ:JavaScript でレンダリングされるページは追加の待機時間が必要になる可能性がある
- 多言語サポート:英語以外のウェブページに対する埋め込みモデルの効果はさらに検証が必要
7.2 パフォーマンス最適化の提案
- Qdrant バックエンドを使用:量子化(quantization)をサポートし、インデックスサイズを 4-8 倍に圧縮可能
- バッチインデックス構築:大規模なドキュメントコレクションの場合、分散埋め込みを使用(
--gpu-ids 0,1,2,3) - スクリーンショットをキャッシュ:同じウェブページへの複数回のクエリの場合、スクリーンショット結果をキャッシュして繰り返しレンダリングを回避
- ハイブリッドパイプライン:純粋なテキストページには従来の RAG を使用し、複雑なページには PixelRAG を使用
8. FAQ
Q1:PixelRAG と従来のスクリーンショット + OCR の違いは何ですか?
PixelRAG は OCR ではありません。OCR は画像からテキストを抽出しますが、依然として視覚構造情報を失います。PixelRAG は視覚埋め込みモデルを使用して画像上で直接検索し、レイアウト、色、チャートなどを含む完全な視覚情報を保持します。
Q2:GPU がなくても PixelRAG を使用できますか?
はい。pixelshot スクリーンショット機能は GPU を必要とせず、CPU で実行できます。埋め込みとインデックス構築段階も CPU をサポートしています(device: cpu)が、速度は大幅に遅くなります。小規模なテストの場合、CPU で完全に十分です。
Q3:PixelRAG は中国語のウェブページをサポートしていますか?
はい。PixelRAG のスクリーンショット機能はどの言語のウェブページでも機能します。埋め込みモデルは Qwen3-VL に基づいており、中国語を良好にサポートしています。ただし、論文の実験は主に英語の Wikipedia で行われており、中国語の効果の詳細な評価データはまだ不足しています。
Q4:PixelRAG は LangChain/LlamaIndex を置き換えられますか?
直接置き換えることはできません。PixelRAG は異なる検索パラダイムであり、視覚情報の保持に焦点を当てています。RAG パイプラインの検索器として使用し、LangChain などのフレームワークの他のコンポーネントと組み合わせて使用できます。従来のテキスト RAG のベクトル検索ソリューションが必要な場合は、TurboVec ベクトル検索ガイドと ZVec ベクトルデータベースガイドを参照してください。
Q5:PixelRAG の検索速度はどのくらいですか?
インデックスの規模によって異なります。ローカルの小規模インデックス(数百のドキュメント)の場合、検索遅延はミリ秒レベルです。828 万ページの Wikipedia インデックスの場合、FAISS を使用した検索遅延は約 100-500ms です。ボトルネックは通常、スクリーンショットレンダリング段階(ページあたり 1-3 秒)にあり、検索段階ではありません。
9. 総合評価
PixelRAG は RAG 分野における重要なパラダイムシフトを表しています:「テキストを解析する」から「視覚を理解する」へ。従来の RAG を置き換えるものではなく、従来のパイプラインの視覚情報処理における空白を埋めるものです。
利点: - ✅ ウェブページの視覚情報を 100% 保持、テーブル、チャート、レイアウトはもう失われない - ✅ UC Berkeley チーム出身、学術的品質が保証されている - ✅ 完全にオープンソース(Apache 2.0)、自由に使用可能 - ✅ 828 万 Wikipedia の事前構築インデックスを提供、すぐに使用可能 - ✅ Claude Code プラグインをサポート、AI プログラミングワークフローに統合
欠点: - ⚠️ インデックスサイズが大きく、ハードウェア要件が高い - ⚠️ スクリーンショットレンダリング速度が遅く、リアルタイムシナリオには適していない - ⚠️ プロジェクトが比較的新しい(2026 年 5 月リリース)、コミュニティエコシステムはまだ構築中
推奨指数:⭐⭐⭐⭐(4/5)
RAG アプリケーションがテーブル、チャート、コードなどの視覚集約型コンテンツを含むウェブページを処理する必要がある場合、PixelRAG は試す価値があります。特に以下のシナリオに適しています:
- 技術ドキュメント Q&A:コード、API ドキュメント、アーキテクチャ図
- データレポート分析:財務レポート、統計チャート、データテーブル
- 学術文献検索:論文の数式、チャート、実験結果
- ウェブコンテンツ理解:「読む」のではなく「見る」必要があるアプリケーション
参考リンク: - GitHub リポジトリ:StarTrail-org/PixelRAG - 論文:PIXELRAG: Web Screenshots Beat Text for Retrieval-Augmented Generation - オンラインデモ:pixelrag.ai - API ドキュメント:pixelrag.ai/docs