Streamlit ホスティング基盤を どのように作ったか 2024.09.17 GO株式会社 伊田 正寿

© GO Inc. 2 自己紹介 GO株式会社 データエンジニア ／ 伊田 正寿 ● 家族: 妻、長女5歳、次女2歳 ● 夏休み: サンリオピューロランドに行きました。けろけろけろっぴ推し プロフィール写真 正方形にトリミングした写 真を「図形に合わせてトリ ミング」で円形にすると真 円になる

© GO Inc. 課題 1. 問い合わせ対応の負荷軽減のため、Streamlit を利用して手軽にツー ルを公開したいという要望があがっていた 2. Lookerの制約で可視化が難しい分析があった。具体的にはLookerは 件数が5000件までの制限があることや、統計モデルなどを利用した インタラクティブな可視化ができなかった。一方、JupyterHub では 可視化は可能であるが社内に広く共有するものではなかった これらの要望に対応するため Streamlit のホスティングの検討を始めた

© GO Inc. 4 ホスティングの要件 ● クラウド上で開発が完結する ○ 弊社のデータの利用ルールとして、本番データをローカルにダウ ンロードすることを禁止していることから、クラウド上で開発が 完結する必要がある ● 開発者専用の Streamlit をホスティングする ○ 開発者専用とすることで利便性向上を図る ■ 開発作業でコンフリクトが発生しない ■ 好きなライブラリを自由に導入できる ■ OOMなどが発生しても他のホストに影響を与えない

© GO Inc. ホスティング基盤により、開 発者は分析結果を共有できる ようになった ■仕組み 開発者はコードエディタ (Jupyter) で編集し、 Streamlit で可視化する。 Streamlit と Jupyter は永続 ストレージを共有しており、 .py ファイルを配置すると、 Streamlit のホットリロード 機能でコードが反映される 5 Streamlit ホスティング基盤 v1 アーキテクチャ BigQuery 分析 データ ・ ・ ・ コンテナ実行環境 開発者 ロード バランサー Cloud Load Balancing 認証 Identity-Aware Proxy IP制限 Cloud Armor 閲覧者1 閲覧者2 閲覧者n ・ ・ ・ GCP分析環境 サイト1 サイト1 コード エディタ (Jupyter) 永続 ストレージ1 サイトn サイトn コード エディタ (Jupyter) 永続 ストレージn

© GO Inc. 解決策３ Pull Request のマージで GitHub Actions を発火し、 自動デプロイする 解決策1 GitHub Copilot が利用できる 環境を構築する v2での解決策 6 v1 アーキテクチャ の問題点 課題２ 他の人のコードを真似できない 課題３ JupyterのUIで複数ファイルを Streamlitにデプロイするのが 面倒だ 課題1 Jupyter では GitHub Copilot が利用できないので 生産性が低い v1の問題点 開発者に環境を開放したところ下記の問題点が出たことから、v1 を破棄して v2 として作り直す ことにした 解決策２ GitHub でコードを管理する

© GO Inc. 要件 ● クラウド上で開発が完結する ● 開発者専用の Streamlit をホスティングする 追加要件 ● 解決策1 ○ GitHub Copilot が利用できる ● 解決策2 ○ GitHub でコードを管理する ● 解決策3 ○ PR のマージで GitHub Actions を発火し、自動デプロイする 7 ホスティングの要件 v2

© GO Inc. 8 プレビュー環境 と 社内公開環境 プレビュー環境 コンテナ実行環境 サイト 追加要件に対応するためプレビュー環境と社内公開環境の2枚構成にすることにした ● プレビュー環境は GitHub Copilot を使って開発&デバッグできる方式を構築する ● 社内公開環境は PR のマージで GitHub Actions による自動デプロイ方式に直す 開発者 社内公開環境 コンテナ実行環境 イメージ リポジトリ サイト

© GO Inc. プレビュー環境により、GitHub Copilot の支 援を受けて開発することができるようになった ■仕組み コンテナ開発支援ツールを利用してローカルで GitHub Copilot の支援を受けて開発し、デ バッグはGKE上のコンテナにポートフォワード で実施する ● Skaffold はビルド、プッシュ、コンテナ 作成、ポートフォワードを1コマンドで実 行できるツールである ● Skaffold はローカルの変更を検知してす ぐにプレビュー環境に反映できるので開 発体験を損なわない ● ツール利用時に必要となるライブラリ、 k8sなどの設定、コマンドはタスクラン ナーで隠蔽した。これにより開発者は開 発に集中できる 9 Streamlit ホスティング基盤 v2 (プレビュー環境) Internet コンテナ実行環境 サイト 上り下り ともに 通信不可 BigQuery 分析 データ イメージ リポジトリ 開発者 コンテナ開発支援ツール (Skaffold) イメージ プッシュ GCP分析環境 コンテナデプロイ & ポートフォワード

© GO Inc. 10 Streamlit ホスティング基盤 v2 (社内公開環境) BigQuery 分析 データ ・ ・ ・ コンテナ実行環境 ロード バランサー Cloud Load Balancing 認証 Identity-Aware Proxy IP制限 Cloud Armor 閲覧者1 閲覧者2 閲覧者n ・ ・ ・ GCP分析環境 サイト1 サイトn リバース プロキシ イメージ リポジトリ 開発者 ホスティング基盤により、開発 者は分析結果を共有できるよう になった ■仕組み プレビュー環境を利用して開発 したコードを GitHub にプッ シュし、Pull Request をマージ すると本番にデプロイされる ※ nginx導入は運用改善パート で解説します

© GO Inc. 11 ■結果 ● 狙い通り2つの課題は解決できた ■予想以上の反響 ● 開発者: 20名 ● 閲覧者: 130名(2024年1月〜8月実績) ※ 全社員約600名(2024年6月時点) ■アナリストからの評判 ● BIツールで実装するにはちょっと複雑な分析を、フィルター条件を変 えながら見たいという要望があり、それを適宜出し直してレポートに まとめる手間がなくなったので非常に助かっています ● Jupyter Notebook で実行していたものを Streamlit に移行したこと で可視化工数が低くなったと感じています ● ローカルのIDEで本番のデータを使えてストレスフリーでした 結果

© GO Inc. 12 ● 課題 ○ 問い合わせ対応の負荷軽減のために手軽にツールを公開したい ○ Lookerの制約で可視化が難しい分析があった。一方、JupyterHub で は可視化は可能であるが社内に広く共有するものではなかった ● 要件 ○ クラウド上で開発が完結する ○ 開発者専用の Streamlit をホスティングする ○ GitHub Copilot が利用できる ○ GitHub でコードを管理する ○ Pull Request のマージで GitHub Actions を発火し、自動デプロイする ● ホスティング基盤 ○ 紆余曲折を経て、プレビュー環境と社内公開環境の2枚構成となった ● 結果 ○ 狙い通り課題を解決できた。さらに全社員の2割相当に利用されてお り、Streamlit ホスティング基盤がなくてはならないものになった まとめ

© GO Inc. 文章・画像等の内容の無断転載及び複製等の行為はご遠慮ください