Read Frog完全ガイド｜20以上のAIモデル対応・APIコスト70%削減のOSS没入型翻訳拡張

Read Frogとは——OSS没入型AI翻訳拡張の全体像

Read Frogは、ウェブブラウザ上で動作するオープンソースのAI翻訳拡張機能だ。GitHubで5,100以上のスターを獲得し、Chrome・Edge・Firefoxの3大ブラウザに対応している。公式サイトでは「Open Source AI-powered language learning extension for browsers」と説明されており、単なる翻訳ツールではなく言語学習を支援するAI拡張として設計されている。

最大の特徴は、20以上のAIプロバイダーに対応し、ユーザーが自由にモデルを切り替えられる点だ。OpenAI、DeepSeek、Anthropic Claude、Google Gemini、xAI Grok、Groq、Mistral、Ollamaなど、用途やコストに応じて最適なモデルを選択できる。さらにGoogle翻訳やMicrosoft翻訳、DeepLXといった無料翻訳オプションも利用でき、APIキーなしでも基本的な翻訳が可能だ。

Vercel AI SDKを基盤としており、TypeScript + React + WXT（Web Extension Toolkit）で書かれたモダンなアーキテクチャを採用している。GPLv3ライセンスで公開されているため、コードの中身を確認でき、セキュリティ面での透明性も高い。OpenHandsのようなAIエージェントがコード生成を自動化するのとは異なり、Read Frogは「人間の読解体験をAIで拡張する」というアプローチを取っている。

「翻訳ツールは飽和している。だが、AIプロバイダーを自由に切り替えられ、かつ文脈と学習支援まで備えたOSSは意外と少ない」——これがRead Frogが短期間で5,000スターを集めた理由だ。

Browser Useがブラウザ操作自体を自動化するのに対し、Read Frogは読解体験の拡張に特化している。役割がはっきり分かれているため、AIエージェントと併用しても干渉しない。

主要機能を徹底解説——バイリンガル表示からTTSまで

Read Frogが提供する機能は、大手クローズドソース翻訳拡張にも引けを取らない。公式READMEに記載されている主要機能を順に見ていこう。

バイリンガル表示と翻訳のみモード

2つの翻訳表示モードを切り替えられる。バイリンガルモードでは原文と訳文を並べて表示し、語学学習に最適だ。翻訳のみモードでは原文を完全に置き換え、すっきりした読書体験を提供する。翻訳中にモードを切り替えると、表示中のすべてのコンテンツが自動的に再翻訳される。

文脈認識翻訳（Context-Aware Translation）

Mozilla Readabilityライブラリを使って記事のタイトルと本文を抽出し、その文脈をAIに渡すことで、より正確な翻訳を実現する。技術用語がドメインに応じて正しく翻訳され、文学的な表現もニュアンスを維持し、あいまいな表現も前後の文脈に基づいて解釈される。

選択翻訳（Selection Translation）

ウェブページ上の任意のテキストを選択すると、スマートツールバーが表示される。Translateでリアルタイムストリーミング翻訳、Explainで言語レベルに応じた詳細な説明、Speakでテキスト読み上げが可能だ。

YouTube字幕翻訳

YouTubeの字幕を動画プレーヤー上で直接翻訳する。外国語コンテンツの字幕に翻訳を重ねて表示でき、動画を使った語学学習にも対応している。

TTS（テキスト読み上げ）

Edge TTSを採用し、80以上の言語で150以上のAI音声を完全無料で利用可能。速度・ピッチ・音量の調整に加え、自動言語検出と言語別音声マッピングにより、適切な音声が自動選択される。長文テキストは文単位で分割し、次のチャンクをプリフェッチすることでシームレスな再生を実現する。

機能マップ——他拡張との守備範囲の差

インストールとセットアップ手順

Read Frogは各ブラウザのストアからインストールできる。APIキーがなくてもGoogle翻訳等の無料プロバイダーで動作するため、導入のハードルは低い。

ブラウザ別インストール

# Chrome Web Store
https://chromewebstore.google.com/detail/read-frog-open-source-ai/modkelfkcfjpgbfmnbnllalkiogfofhb

# Microsoft Edge Addons
https://microsoftedge.microsoft.com/addons/detail/read-frog-open-source-a/cbcbomlgikfbdnoaohcjfledcoklcjbo

# Firefox Add-ons
https://addons.mozilla.org/firefox/addon/read-frog-open-ai-translator/

AIプロバイダーの設定

インストール後、利用したいAIプロバイダーのAPIキーを設定する。以下はOpenAIを使う場合の設定例だ。

1. Read Frogのアイコンをクリック → Settings
2. AI Provider セクションで "OpenAI" を選択
3. API Key フィールドに自分のキーを入力
   例: sk-proj-xxxxxxxxxxxxxxxxxxxx
4. Model で使用するモデルを選択
   例: gpt-4o, gpt-4o-mini
5. Save をクリックして保存

ローカルLLMを使いたい場合はOllamaを選択し、エンドポイントを指定する。プライバシー重視の組織ではこの構成が定番だ。

# Ollamaをローカルで起動している場合
Provider: Ollama
Endpoint: http://localhost:11434
Model: llama3, gemma2, phi3 など

# カスタムエンドポイントの場合
Provider: Custom
Endpoint: https://your-api-endpoint.example.com/v1
API Key: your-api-key

カスタムプロンプトで翻訳品質をチューニングする

翻訳の品質を改善するために、独自のプロンプトを定義できる。以下のトークンが利用可能だ。

# 利用可能なトークン
[TARGET_LANG]  - 翻訳先の言語
[INPUT]        - 翻訳対象のテキスト
[TITLE]        - 記事のタイトル
[SUMMARY]      - 記事の要約

# カスタムプロンプト例（技術文書向け）
あなたはプロの技術翻訳者です。以下のテキストを[TARGET_LANG]に翻訳してください。
技術用語は原則カタカナ表記とし、広く知られた用語はそのまま英語表記を維持してください。
記事タイトル: [TITLE]
記事概要: [SUMMARY]
翻訳対象: [INPUT]

カスタムプロンプトは技術文書・法律文書・医療文書など、ドメイン特化翻訳で効果を発揮する。Read Frog最大の拡張ポイントといってよい。

APIコスト70%削減の仕組み——バッチリクエストを読み解く

Read Frogの注目すべき機能の一つが、バッチリクエストだ。通常、ページ内の各テキストブロックを個別にAPIへ送信するとリクエスト数が膨大になり、APIコストがかさむ。Read Frogは複数の翻訳リクエストをまとめて1回のAPI呼び出しに統合することで、オーバーヘッドとトークン使用量を削減する。

公式READMEによると、この仕組みで最大70%のAPIコスト削減が可能だ。スマートリトライロジック（指数バックオフ付き）を搭載し、バッチ処理が失敗した場合は自動的に個別リクエストへフォールバックする。これらの処理はバックグラウンドで透過的に行われる。

# バッチなし（従来型）
リクエスト1: 「段落A」 → API
リクエスト2: 「段落B」 → API
リクエスト3: 「段落C」 → API
...
# ページ全体で数十〜数百リクエスト発生

# バッチあり（Read Frog）
リクエスト: [「段落A」, 「段落B」, 「段落C」, ...] → API（1回）
# トークン重複プロンプトを排除し最大70%削減

Claude CodeのようなAI開発ツールでもトークンコストは常に課題だが、Read Frogはブラウザ翻訳という領域で同様のコスト最適化を実現している。

翻訳ツール横断比較

Read Frogの最大の差別化ポイントは、オープンソースであることとAIプロバイダーの自由な選択だ。Immersive Translate（沈浸式翻訳）が商用サービスとしてクローズドに運営されるのに対し、Read FrogはGPLv3で全コードが公開されており、プロバイダーロックインが一切ない。

記事分析機能（Read Article）——翻訳を超える語学学習

Read Frogの「Read Article」機能は、翻訳を超えた語学学習機能を提供する。ワンクリックで以下の処理が実行される。

1. Mozilla Readabilityで記事の本文を抽出
2. ソース言語を自動検出
3. ターゲット言語で要約と紹介文を生成
4. 文単位の翻訳＋語彙説明を生成

特に注目すべきは、ユーザーの言語レベル（初級・中級・上級）に応じて説明の詳細度が変わる点だ。各文について、キーワードの定義、文法分析、文脈に基づいた説明が提供される。公式READMEでは「It’s like having a personal language tutor analyze every article you read」と表現されている。

読書体験の3段階モード

英語の技術ドキュメントを日常的に読むエンジニアにとって、この機能は特に実用的だ。ForgeCodeのようなAIコーディングツールを使いこなす際も、英語のドキュメントやIssueを素早く理解する必要がある場面は多い。Read Frogの記事分析機能があれば、翻訳と同時に技術用語の学習も進められる。

プロバイダーごとの使い分け——目的別の最適解

20以上のAIプロバイダーに対応しているRead Frogでは、どれを選ぶかで翻訳品質・速度・コストが大きく変わる。用途別の選択指針を整理する。

プロバイダー選択マトリクス

# 実際のSettings.json 相当の切替イメージ
providers:
  primary:
    name: openai
    model: gpt-4o-mini
    api_key: ${OPENAI_API_KEY}
  fallback:
    name: google-translate
    free: true
  local:
    name: ollama
    endpoint: http://localhost:11434
    model: llama3
routing:
  technical_docs: primary
  bulk_translation: fallback
  confidential: local

「メインAI＋フォールバック無料翻訳＋機密用ローカルLLM」の3段構えで運用するのがRead Frogの真価を引き出すセットアップだ。

無料プロバイダー活用のTips

APIキーが用意できないユーザーでも、Google翻訳・Microsoft翻訳・DeepLXといった無料プロバイダーを組み合わせれば十分な翻訳体験が得られる。日常のニュース記事閲覧ならこの組み合わせで困ることはほぼない。

「APIを持っていないユーザーがページ翻訳だけ無料プロバイダーで済ませ、コードブロックや技術用語だけAIに切り替える」という使い方も可能。

実践活用パターン——読む・学ぶ・作業する

Read Frogは翻訳ツールの枠を超えて、日常の情報収集・学習・業務に組み込める。具体的な活用パターンを紹介する。

パターン1：英語技術ブログの高速理解

GitHub Blog、OpenAI Blog、AnthropicのリリースノートなどをバイリンガルモードでRead Articleにかける。要約→重要段落だけ精読→語彙説明で知識定着、という流れが数分で完結する。

1. 記事を開く
2. Read Frog → Bilingual Mode
3. 上部ツールバーで Provider: Claude Sonnet 選択
4. Read Article → 初級解説で概要を把握
5. 気になる段落だけ選択翻訳 + Explain

パターン2：YouTube英語講義の学習

英語ディレクターのYouTube解説動画に対して字幕翻訳を重ね、要点を掴みながら英文字幕もそのまま表示させる。必要に応じてTTSでリピートリスニングする。

パターン3：非英語圏ニュースの横断調査

ドイツ語・中国語・ポルトガル語などのメディアを日本語で読む調査用途。無料プロバイダー中心で運用しつつ、決定的に重要な段落だけClaudeで再翻訳する。

パターン4：PR・Issueの翻訳と要約

GitHubのPR・Issueを開き、選択翻訳を組み合わせると英語でのコラボレーションが圧倒的に早くなる。コードブロックは翻訳せず、コメントだけ日本語に変換する設定も可能。

設定例:
- ignoreSelectors: "pre, code, .highlight"
- targetSelectors: "p, li, td, h1, h2, h3"
→ コードを避けて自然言語だけ翻訳

パターン5：社内ドキュメントのローカル翻訳

Ollamaを使って、社外に出せない社内Wikiや仕様書をローカルLLMで翻訳する。APIキーを社外に出す必要がないためセキュリティ的にも安心だ。

Read Frogの強みは、単機能ではなく「読む・学ぶ・作業する」を全部カバーできる点だ。翻訳・学習・業務の境界を曖昧にしてくれる。

開発への参加とプロジェクト構造

Read Frogはオープンソースプロジェクトとして、コミュニティからの貢献を歓迎している。TypeScript + React + WXT（Web Extension Toolkit）で構築されており、モダンなフロントエンド開発の知識があれば参加しやすい。

プロジェクト構造の概観

read-frog/
├── apps/
│   └── extension/           # ブラウザ拡張本体
│       ├── entrypoints/     # WXTのエントリ定義
│       ├── components/      # UI部品
│       └── providers/       # AIプロバイダー抽象化
├── packages/
│   ├── i18n/                # 多言語リソース
│   └── tts/                 # TTSエンジン連携
├── docs/                    # 公式ドキュメント
└── README.md

WXTフレームワークを採用しているため、ブラウザ間の差異を吸収しつつChrome/Edge/Firefoxの同時ビルドが可能になっている。ブラウザ拡張開発の学習題材としても優秀だ。

プロジェクト構造の詳細はDeepWikiで確認でき、AIベースのコード理解ツールDosuも提供されている。コントリビューションガイドは公式チュートリアルに掲載されている。

Discordコミュニティも活発で、開発者への質問やフィードバックが可能だ。ライセンスはGPLv3と商用ライセンスのデュアルライセンス方式を採用しており、商用利用の場合は別途ライセンス取得が必要となる。

貢献のしやすさチェック

競合ツールとの棲み分け——OSSエコシステムの中でのRead Frog

翻訳拡張は多数存在するが、Read Frogの立ち位置は「OSS×AIプロバイダー中立×学習支援」という稀有な組み合わせだ。他ツールと比べたときの棲み分けを整理する。

「翻訳拡張は完成度で選ぶ時代から、プロバイダー中立で選ぶ時代に移った」——AIモデルの多様化が進んだ結果、特定プロバイダーにロックインされるのはリスクだ。

Read Frogが提供する「AIプロバイダーを自分で選べる自由」は、2026年のAI翻訳拡張の標準になりつつある。

📌 まとめ

Read Frogは「翻訳拡張」のカテゴリを一段押し上げるOSSプロジェクトだ。20以上のAIプロバイダーに対応し、バイリンガル表示・文脈認識・YouTube字幕・TTS・記事分析まで1つの拡張でカバーする。さらにバッチリクエストによってAPIコストを最大70%削減できるため、AI翻訳の「品質と財布」のトレードオフに悩まなくて済む。

本記事で押さえたRead Frogのポイントを再整理すると：

1. 構造：GPLv3の完全オープンソース、TypeScript + React + WXTで3ブラウザ同時対応
2. プロバイダー：OpenAI / Claude / Gemini / DeepSeek / Groq / Ollama など20+を自由切替
3. コア機能：バイリンガル/翻訳のみ/選択翻訳＋Readabilityによる文脈認識
4. 学習支援：Read Articleで要約＋語彙説明、初級〜上級の粒度調整
5. コスト最適化：バッチリクエストで70%削減、無料プロバイダーとの併用で費用ゼロ運用も可
6. セキュリティ：Ollama連携で機密データをローカル完結翻訳できる

「AIプロバイダーを選ぶ自由と、読解体験を拡張する機能性。Read Frogは2つを同時に提供する数少ないOSS翻訳拡張だ」——まずはChrome/Edge/Firefoxのストアから導入し、無料プロバイダーで体験してみてほしい。

AIエージェントの活用と並行して、情報インプットの質を上げたい人にも最適なツールだ。OpenHandsやBrowser Useでブラウザ操作の自動化を進めつつ、Read Frogで「読む」体験をAIで拡張する——この組み合わせは2026年のAI活用スタイルとして定着していくはずだ。

参照ソース

• Read Frog GitHub リポジトリ
• Read Frog 公式サイト
• Read Frog チュートリアル
• Chrome Web Store - Read Frog
• DeepWiki - Read Frog 解説