gradio-app/gradioは、Pythonだけで機械学習モデルのデモUIとAPIを作れるフレームワークのモノレポです。中核のPythonライブラリに加え、JavaScript版クライアント(client/js)とPython版クライアント(client/python)が同居し、生成したアプリへ後からプログラムで接続できます。demoディレクトリには数百件のrun.pyサンプルがあり、コンポーネントの実例集としても機能します。
Python側でBlocksやInterfaceを組み立てて起動すると、ローカルサーバーが立ち上がります。このサーバーは/configや/infoなどのエンドポイントで、UI構成とAPI仕様を公開します。client/js/src/client.tsのClientクラスは、この/config情報を取得します。取得後はupload・queue/join・queue/dataなどのURL定数(constants.ts)を使い、ファイル送信や推論リクエストを行います。推論結果はSSE(EventSource)でストリーミングされ、apply_diffのような差分適用ロジックでチャットの逐次更新にも対応します。パッケージ管理はpnpmワークスペースとchangesets(.changeset/)で行われ、gradio本体とgradio_client(JS版・Python版)のバージョンを連動させて公開します。
- STEP 01
pip install gradioを実行すると、gradio本体とgradio_clientが同時にインストールされます。
- STEP 02
demoフォルダ内のrun.pyの一つ、例えばdemo/audio_component/run.pyをpython run.pyで起動すると、ローカルにWebサーバーが立ち上がりブラウザで確認できます。
- STEP 03
起動後にfrom gradio_client import Clientでアプリのアドレスを渡すと、ブラウザを開かずに同じAPIを呼び出せます。
- STEP 04
client/jsを試す場合はpnpm installでモノレポ全体の依存関係を入れる必要があり、単体のフォルダだけではビルドできない構成です。
- STEP 05
テストを回すとclient/python/test/test_client.pyやclient/js/src/test配下のvitestが実行され、SSEやファイルアップロードの挙動が細かく検証されます。
- STEP 06
.changeset/配下にmarkdownファイルを追加してバージョンを管理する運用のため、変更を提出する際はchangesetの作成も求められます。
手元にはブラウザで開けるローカルWebアプリと、外部に共有できるリンクが残ります。加えてPython・JavaScriptどちらのクライアントからも、同じアプリのAPIをコードから呼び出せる状態が得られます。demo配下の実例を読めば、目的のコンポーネントに近い実装をそのまま流用できます。
ファイルツリーの中心はclient/js・client/python・demoで、gradio本体のPythonコンポーネント実装そのものは今回の資料に含まれておらず、詳細は確認できません。
モノレポ全体をビルド・テストするにはpnpm、Python 3.10以上、Node.js 18以上が必要で、環境構築にはある程度の手間がかかります。
プライベートなHugging Face Spaceに接続する場合はtokenが必須で、未設定だと401エラーになるとPRIVATE_SPACE_MSGのメッセージから読み取れます。
3.x以前のレガシー版Gradioアプリは通信方式がWebSocketのため、このクライアントでは接続できないとWS_PROTOCOL_MSGに明記されています。
Pythonのみでモデルの動作確認用UIをすぐ用意したい人や、既存のGradioアプリへプログラムからアクセスしたい開発者に向いています。client.tsやconstants.tsのエンドポイント定義、テスト群、changesetsによるバージョン運用まで一貫して確認できるため、実際に動かさなくても構成と挙動の見立ては十分に立てられます。ただしgradio本体の実装詳細までは本資料だけでは検証できない点に注意してください。