2026年10月29日、PythonだけでWebのダッシュボードを作れるフレームワークDashの4.5.0が公開されました。7月の4.4.1から、およそ3か月ぶりの新しい版です。
今回の目玉は、ストリーミングコールバックという新しい仕組みです。時間のかかる処理の途中経過を、終わるのを待たずに、少しずつ画面に届けられるようになりました。
ほかにも、SNSでURLを共有したときに表示される説明文の設定や、画面の更新を速くする改善がたくさん入っています。今回は、4.4.1と4.5.0で同じアプリを動かしながら、何が変わったのかを見ていきます。
まずはDashとはどんなものか¶
最初に、Dashを知らない方のために、どんなフレームワークなのかを簡単に紹介します。Dashは、グラフ作成ライブラリPlotlyを作っている会社が開発している、ダッシュボードづくりのためのフレームワークです。
ダッシュボードとは、売上やアクセス数などの数字を、グラフや表で一目でわかるようにまとめた画面のことです。Dashを使うと、HTMLやJavaScriptを書かずに、Pythonだけでこうした画面を作れます。
よく比べられるStreamlitとの違い¶
Pythonだけで画面を作れるツールとしては、Streamlitもよく知られています。2つの違いを、大まかに表にまとめます。
| 項目 | Dash | Streamlit |
|---|---|---|
| 画面の作り方 | 部品を並べてレイアウトを組み立てる | 上から順にスクリプトを書く |
| 画面の更新 | コールバックで、変わった部分だけを更新 | 操作のたびにスクリプトを上から実行し直す |
| 向いている用途 | 部品の多い、作り込んだダッシュボード | 手早く作る試作やデータの共有 |
Streamlitの使い方は、こちらで紹介しています。【関連記事】PythonのStreamlitとは？
コールバックとは¶
Dashでは、ボタンが押された、入力欄が変わった、といった操作に応じて、画面の一部を書き換える関数を用意します。この関数をコールバックと呼びます。
これまでのコールバックは、処理が全部終わってから、結果を1回だけ画面に返していました。今回の新機能は、ここを変えるものです。
4.5で何が変わったのかを整理しよう¶
続いて、4.5.0の主な変更を表にまとめます。内容は、Dashの公式リポジトリにある変更履歴CHANGELOG.mdにもとづいています。
| 分類 | 主な変更 |
|---|---|
| 新機能 | async defとyieldで書いた、ストリーミングコールバック |
| 新機能 | app.titleなどから、SNS向けのmetaタグを作る |
| 新機能 | 部品を作り直させるdash.remount |
| 新機能 | React 19への試験的な対応（標準はReact 18.3.1のまま） |
| 削除 | React 16への対応を終了 |
| 速度 | パターンマッチのコールバックや、画面の部品の更新を高速化 |
PyPIの記録によると、4.5.0は9月から3回の候補版を経て公開されました。必要なPythonは、3.9以上のままです。
ストリーミングコールバックを試してみた¶
まずは、目玉のストリーミングコールバックから見ていきましょう。変更履歴によると、async defの関数の中でyieldを使ってコールバックを書くと、yieldした値が、作られるたびにブラウザへ送られます。
yieldは、関数の途中で値を返し、そこからまた続きを実行できるようにする書き方です。基本は、こちらで紹介しています。【関連記事】Pythonのyieldとは？
3段階で進み具合を知らせるアプリ¶
実際に、ボタンを押すと、1/3完了、2/3完了、3/3完了と、進み具合を順に表示するアプリを作ってみました。
import asyncio
import dash
from dash import Dash, Input, Output, html
app = Dash(__name__, shared_storage=dash.LocalSharedStorage)
app.layout = html.Div([html.Button("開始", id="btn"), html.Div(id="out")])
@app.callback(Output("out", "children"), Input("btn", "n_clicks"))
async def progress(n):
for i in range(1, 4):
yield f"{i}/3 完了"
await asyncio.sleep(0.1)
await asyncio.sleep(0.1)は、時間のかかる処理の代わりに、0.1秒待つだけの行です。非同期処理そのものについては、こちらで紹介しています。【関連記事】Pythonのasyncioとは？
サーバーが返したもの¶
ブラウザの代わりに、Flaskのテスト用の機能で、ボタンを押したときのリクエストをサーバーへ送ってみました。手元のPython 3.11で、4.5.0が返した中身です。
200 application/x-ndjson
{"multi":true,"response":{"out":{"children":"1/3 完了"}}}
{"multi":true,"response":{"out":{"children":"2/3 完了"}}}
{"multi":true,"response":{"out":{"children":"3/3 完了"}}}
{"done":true}
NDJSONは、1行に1つずつJSONを並べた形式です。完了は完了という文字を表していて、yieldした3つの値が、1行ずつ順番に送られているのがわかります。
一方で、4.4.1で同じコールバックを動かすと、async_generatorという型の値はJSONにできない、というTypeErrorになりました。4.4.1では、このような書き方にはまだ対応していなかったわけです。
動かすために必要だった2つの準備¶
試してみて、つまずいたところが2つありました。どちらも、エラーの文面が次に何をすればよいかを教えてくれたので、すぐに直せました。
| つまずいたこと | エラーの内容 | 対処 |
|---|---|---|
| async defのコールバックが動かない | dash[async]を入れるよう案内された | pip install "dash[async]"で入れる |
| ストリーミングが始まらない | HTTPで流すには共有ストレージが必要と言われた | shared_storage=dash.LocalSharedStorageを渡す |
変更履歴によると、HTTPでストリーミングするには共有ストレージが必要で、ない場合はサーバーの準備の段階でエラーになるよう変わりました。共有ストレージとは、複数のプロセスの間でデータを受け渡すための仕組みです。
なお、変更履歴には、FastAPIやQuartを土台にしてWebSocketで通信する場合は、共有ストレージがいらないとも書かれています。FastAPIについては、こちらで紹介しています。【関連記事】PythonのFastAPIとは？
SNSで共有したときの表示を設定できるように¶
次は、地味ですが便利な変更です。変更履歴によると、app.title、app.description、app.imageの3つを設定すると、SNS向けのmetaタグが作られるようになりました。
metaタグとは、ページの説明などを、ブラウザやSNSに伝えるためのHTMLの部品です。XやSlackなどにURLを貼ったときに表示される、タイトルと説明文のカードは、このmetaタグから作られています。
4.4.1と4.5.0で比べてみた¶
タイトルと説明文を設定したアプリで、ページのHTMLにどんなタグが入るかを比べました。
from dash import Dash, html
app = Dash(__name__)
app.title = "売上ダッシュボード"
app.description = "店舗ごとの売上をグラフで確認できます"
app.layout = html.Div("こんにちは")
4.5.0では、次のようなタグが新しく加わりました。4.4.1では、これらのタグは1つも入っていませんでした。
<meta name="description" content="店舗ごとの売上をグラフで確認できます">
<meta property="twitter:title" content="売上ダッシュボード">
<meta property="twitter:description" content="店舗ごとの売上をグラフで確認できます">
<meta property="og:title" content="売上ダッシュボード">
<meta property="og:description" content="店舗ごとの売上をグラフで確認できます">
og:で始まるタグは、多くのSNSが読み取るOGPと呼ばれる決まりごとです。社内でダッシュボードのURLを共有するときも、何の画面なのかがリンクの段階で伝わるようになります。
速くなったところと、直ったところ¶
変更履歴には、速さの改善もたくさん並んでいます。代表的なものを表にまとめます。
| 改善 | 変更履歴に書かれた効果 |
|---|---|
| パターンマッチのALLで400個の部品を更新 | 約580ミリ秒から約140ミリ秒に、およそ4倍速く |
| 大きな部品の中へPatch().append()で追加 | 約16%速く |
| コールバックが返した部品の更新 | 4.2.0から続いていた、3〜4倍遅くなる問題を修正 |
パターンマッチとは、IDの形が同じたくさんの部品を、1つのコールバックでまとめて扱う仕組みです。部品の数が増えるほど遅くなる問題が、今回直されました。
部品を作り直させるdash.remount¶
3つ目の改善に関連して、dash.remountという関数も加わりました。変更履歴によると、4.2.0からは、コールバックが部品を返すたびに作り直されてしまい、遅くなったり、部品の状態が消えたりしていました。
4.5.0では、同じ部品はそのまま中身だけを更新するように戻されました。あえて作り直して状態を消したいときは、remount(部品)のように包んで返す、という使い分けになります。
安全面の修正¶
変更履歴には、安全面の修正も含まれています。たとえば、dcc.Locationなどのリンク先に、javascript:で始まるURLを入れられないようにする修正です。
また、cache_byを指定していないバックグラウンドコールバックで、入力が同じ別々のリクエストの間で、結果が共有されないように直されました。ほかの人の結果が見えてしまうことにつながりかねない問題なので、使っている方は早めに上げておきましょう。
上げる前にやっておきたいこと¶
最後に、Dashを4.5.0へ上げる前に確かめておきたいことを整理します。
| 順番 | 確認すること |
|---|---|
| 1 | REACT_VERSIONで、React 16を指定していないか |
| 2 | 部品の状態が消えることを前提にしたコールバックがないか |
| 3 | ストリーミングを使うなら、dash[async]と共有ストレージを用意したか |
| 4 | 複数のサーバーで動かすなら、署名用の秘密鍵を全台でそろえたか |
4つ目は、変更履歴にある、DASH_SECRET_KEYという新しい環境変数のことです。複数のサーバーで動かすときに、全台に同じ秘密鍵を渡すための仕組みだと説明されています。
私は10年ほどエンジニアとして開発に関わってきましたが、集計に1分ほどかかるダッシュボードで、処理が終わるまで画面が固まったままになり、利用者から壊れているのかと問い合わせが来たことがあります。途中経過を少しずつ見せられるストリーミングは、まさにこういう場面で効く機能です。
まとめ¶
2026年10月29日、Dash 4.5.0が公開されました。async defとyieldで書いたストリーミングコールバックで、途中経過を少しずつ画面に届けられるようになり、SNS向けのmetaタグや、たくさんの速度の改善も入っています。
ストリーミングを試すときは、dash[async]と共有ストレージの準備を忘れずに。エラーの文面がていねいに案内してくれるので、まずは小さなアプリで動かしてみてください。
ここまでお読みいただきありがとうございました。
