Duckdb-Wasmでローカルダッシュボードを作ってみた

Transcript

1. Duckdb-wasmでつくる ローカルダッシュボード クラメソおおさか IT 勉強会 Midosuji Tech #3
2. 自己紹介 名前:nk 職種:製造DX関係(業務自動化・データ可視化 ) 経歴:製造業→SES一年目 使用言語:主にPython(とVBA) 個人でReact・AWS等
3. 内容 ・自分用ダッシュボードを作った。 ・Duckdb-wasmとは ・気づき ・今後検証したいこと
4. こんなダッシュボードが欲し い... 😑 重くないやつ (PowerBIやStreamlitより軽い) デザインを色々 カスタマイズできる。 ローカルで動く (データソースも内包) 社内制約... Macで使えて無料
5. NBAで活躍中の河村勇樹選手のスコアを使用
7. Duckdb…? 🤔
8. Duckdb…? 😲 組み込みデータベース (ローカル) データ分析など 大量の集計向き 必要な列のみ欲しい時 高速 読み込み形式: CSV,JSON,Parguet…
9. Wasm(Webassembly)…? 🤔
10. Wasm…? 😧 バックエンド処理を フロントエンドに埋め込む OSやデバイスに依存しない 様々な言語から コンパイルされる サンドボックス内で 安全に処理
11. Duckdb+Wasm…? 🤔
12. Duckdb+Wasm…? 🧐 バックエンド処理 +データベースとの処理を フロントエンドに埋め込む 実質使用言語は Javascript or Typescript +SQL 　データ分析用の 　　　大量集計など可能 このままだとデータは消 える
13. Duckdb+Wasm+OPFS…! 👍 バックエンド処理 +データベースとの処理を フロントエンドに埋め込む 実質使用言語は Javascript or Typescript +SQL データ分析用の 　　　大量集計など可能 +OPFS ブラウザにデータを永続化 (LocalStrageのようなもの)
14. React内で アプリが完結 🙌
15. アプリ構成図 OPFS内 CSV view 👀 ✍
16. コードの一部紹介 (時間がなかったため...)
17. 気づき ・サーバーサイドがない (クライアントサイドしかない ?) ・バックエンドとの繋ぎこみを考えなくて良いの で作るのが楽 ・SQLはそこまで必要ない ・データ更新時のみS3からデータをとってくるな どAWSとの連携可能？ ・
18. 今後検証したいこと 1:セキュリティってほんとに安全？ 2:もっと重いデータでもほんとに速い？ 3:ストリーミングデータは扱えるの？ 4:Postgresqlとの通信ができるの？ 5:parquetでどのくらいの規模のデータを扱える の？ 6:パフォーマンスチューニングって意味ある の？(キャッシュ等) 7:AWS等で作ったパイプラインとの連携 8:実際のデータに基づいたダッシュボードの改 良 ・