Gemini Nano で要約・質問できるブログパーツ
はてなブログの記事をブラウザ組み込みの Gemini Nano で要約したり質問したりできるようにするブログパーツを作ってみた。
はてなブログ記事をgemini nanoで要約するウィジェット · GitHub
はてなブログの管理画面にある「デザイン > カスタマイズ > 記事上HTML」などに貼り付けると、記事ページに折りたたみウィジェットが表示されるようになり、開くとChatBotになる。当該コードは自由に使ったり、改変してもらったりしても問題ないが、何も保証することはできないし、記事引用もせずにスクリプトの直リンク呼び出しやコピペだけして自分のものだと主張するのはやめてほしい（以前、本当にあったのだ）。
展開すると記事本文を Gemini Nano に渡してまず要約し、続いてチップ形式のサジェスト質問と自由入力欄が現れる。質問するたびに次の問いかけ候補が生成される。リクエストや結果はサーバーに送られず、ブラウザの中だけで処理が完結するのがポイントだ。
対応ブラウザは Chrome 138 以上でスマートフォンは対象外なので、対応する場合のみウィジェットが表示されるようにした。初回実行時には数百 MB 程度のモデルのダウンロードが走る。また後述の通り、独自ドメインを利用している場合には Google で Prompt API の Origin Trial トークンを発行して、認識してもらう必要がある。
自分の場合はスクリプトを Firebase Hosting でホストしている。Google Cloud CDN はロードバランサーの固定費が趣味開発の規模感に合わないこと、Cloudflare は安いが Google との契約や課金の外に出てしまうという消去法での選択である。
組み込み LLM で負荷を分散させる
ChatGPT などを利用した AI 記事要約ウィジェットを提供していたといえば Impress Watch だけども、現在は提供を終了している。
Watchシリーズの一部記事において、2024年2月からGoogle「Gemini」による「AI要約」機能を提供してきました。約1年間サービスを継続してきましたが、まもなく終了予定です。終了理由は、利用数は安定しているものの大きく伸びているわけではないこと、「要約」だけで大きな付加価値を見出しづらくなってきたためです。
なんとなく API 利用コストの問題だと思っていたが、実際は LLM モデルの進歩によってコスト自体は下がっており、「要約」は大きな付加価値を見出しづらいから終了とのこと。「ブラウザ組み込みのローカル LLM だったら無料」という打ち出し方だけでは価値が見出しづらいため、要約に加えて簡単な「質問」もできるようにするという方向性が見えてきた。
MCP（Model Context Protocol）の思想に「計算リソースをユーザー側が持ち込む」という発想がある。サービスが API を中央で抱えるのではなく、ユーザーの環境にあるモデルやツールを接続することでサーバー側の負荷や課金ポイントを減らすことができる。
Chrome に組み込まれた Gemini Nano はまさにその形で、記事の要約処理や質問処理はすべてユーザーのブラウザ上で完結し、外部 API への通信は発生しないため、ブログパーツを起動しても JS のホスティング以外に追加コストがかからないし、API キーが漏洩するリスクもない。
AIを使ったアプリの未来はこの方向性なんだろうなぁ
— Panta | 個人開発 (@PantaStudio) 2026年3月22日
ハード側がAIを搭載してれば、開発側で一番ネックなAPI料金を考えずに作ることができる。
小型のLLMでも問題なく動くツールを作って、ランニングコストがかからない設計にするのが個人開発においての勝機かもしれない。 https://t.co/tkjIypzH9s
Apple intelligence を使った文字起こし&要約機能が話題になっていたが、このような基盤組み込みのLLMをうまく使っていく時代になってきているのだと感じる。
Chrome 組み込み Gemini Nano の動作と制約
Gemini Nano の Prompt API はテスト段階という位置付けであり、PC 環境の Chrome 138 以降かつ Origin Trial ヘッダをサーバーから送られた場合のみ動作する仕組みとなっており、初回起動にそれなりのモデルダウンロードが必要となる。
オリジン トライアルでは、新しい機能や試験運用版の機能をご利用いただけます。この機能は、期間限定でテストしてユーザーに提供できます。試用が完了し、フィードバックが評価されると、Chrome は、この機能をすべてのユーザーに公開するかどうかを決定します
はてなブログのドメインについてはすでに Origin Trial に登録済みであるため、問題なく動くはずだ。テスト中だったらしくトークンが外されていることもあるため、明示的に設定する必要がありそう。API が対応していない場合には非表示になるように制御している。
当該サイトが対応しているかについては、Chrome DevTools のアプリケーション → フレーム → top → Origin Trial で確認することができる。独自ドメインの場合にはOrigin Trialsで申請をした上で、head 要素に取得したトークンを入れることで実装できる。
<meta http-equiv="origin-trial" content="{token}" />
要約のみを行えるSummarizer APIについては Chrome 138 以降から Origin Trial がなくても通常利用可能であるため、徐々に当たり前のものになっていくのだろう。
当初は Summarizer API で要約できるものを作っていたが、質問もできるように Prompt API による実装に切り替えた際に、はてなブログのテスト環境（hatenadiary.com）では問題なく動くのに、独自ドメインに切り替えると動かなくなる挙動を切り分けるのに謎に消耗してしまった。Summarizer API とともに Prompt API も使えるものと思い込んでいたのだ。
はてなブログパーツを自作する過渡期の楽しみ
以前にも同じようなことをやっていた。はてなブログにパンくずリストを表示させる JavaScript を作って公開したことがある。
ちょこちょこ勉強しながら作った JavaScript や CSS をはてなブログに読み込ませて勝手に記事レコメンドウィジェットやパンくずリストなどの機能を追加できるようにしていた。やっていて面白かったり勉強になるのは 0 を 1 にする事だ。
パンくずリストは data-vocabulary.org というスキーマに依存していて、そのスキーマが廃止されて動かなくなってしまったし、公式がパンくずリスト機能を実装した時点で役目を終えた過渡期の存在である。
この Gemini Nano のブログパーツも、同じ過渡期の状態にある。Origin Trial なしで動くようになっていくだろうし、公式としてもっと良いものが出る可能性にある。そもそも Agentic Web が進んでいく時代においてブログパーツという発想自体がナンセンスだ。ブラウザ拡張として他のブログで動くものも作れる。
それでも組み込み LLM のプロンプト挙動や Origin Trial の実際など作って動かしてみないと分からない壁もあった。その意味では MVP というよりも、RAT（最重要仮説の検証）であり、動いてしまえば役目を終えてしまう過渡期にのみ面白さと価値が宿るものなのだろう。そんなわけで、何も保証できないけど、しばらくは自分のブログで動かしてみようと思っている。
