Lock in $30 Savings on PRO—Offer Ends Soon! ⏳
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Duckdb-Wasmでローカルダッシュボードを作ってみた
Search
nk
November 02, 2024
Programming
0
200
Duckdb-Wasmでローカルダッシュボードを作ってみた
nk
November 02, 2024
Tweet
Share
Other Decks in Programming
See All in Programming
Seamless Flutter Native Integration: FFI & Pigeon - Dreamwalker (JaichangPark / 박제창) @FlutterKaigi2024
itsmedreamwalker
0
100
Develop iOS apps with Neovim / vimconf_2024
uhooi
1
280
[Do iOS '24] Ship your app on a Friday...and enjoy your weekend!
polpielladev
0
230
TypeScriptでライブラリとの依存を限定的にする方法
tutinoko
3
850
Thoughts and experiences on Rust and TypeScript
unvalley
2
210
テストコード文化を0から作り、変化し続けた組織
kazatohiei
2
310
React への依存を最小にするフロントエンド設計
takonda
21
8.7k
5分ぐらいで分かる、トリミング機能の作り方
tsutsuitakumi
0
180
事業成長を爆速で進めてきたプロダクトエンジニアたちの成功談・失敗談
nealle
3
1.2k
PaaSとSaaSの境目で信頼性と開発速度を両立する 〜TROCCO®︎のこれまでとこれから〜
gtnao
6
6.1k
PipeCDの歩き方
kuro_kurorrr
4
140
Figma Dev Modeで変わる!Flutterの開発体験
watanave
0
3.7k
Featured
See All Featured
Git: the NoSQL Database
bkeepers
PRO
427
64k
GraphQLの誤解/rethinking-graphql
sonatard
67
10k
Embracing the Ebb and Flow
colly
84
4.5k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
6
480
Keith and Marios Guide to Fast Websites
keithpitt
410
22k
Practical Orchestrator
shlominoach
186
10k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
126
18k
Rails Girls Zürich Keynote
gr2m
94
13k
jQuery: Nuts, Bolts and Bling
dougneiner
61
7.5k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
26
1.4k
Why You Should Never Use an ORM
jnunemaker
PRO
54
9.1k
Testing 201, or: Great Expectations
jmmastey
40
7.1k
Transcript
Duckdb-wasmでつくる ローカルダッシュボード クラメソおおさか IT 勉強会 Midosuji Tech #3
自己紹介 名前:nk 職種:製造DX関係(業務自動化・データ可視化 ) 経歴:製造業→SES一年目 使用言語:主にPython(とVBA) 個人でReact・AWS等
内容 ・自分用ダッシュボードを作った。 ・Duckdb-wasmとは ・気づき ・今後検証したいこと
こんなダッシュボードが欲し い... 😑 重くないやつ (PowerBIやStreamlitより軽い) デザインを色々 カスタマイズできる。 ローカルで動く (データソースも内包) 社内制約...
Macで使えて無料
NBAで活躍中の河村勇樹選手のスコアを使用
None
Duckdb…? 🤔
Duckdb…? 😲 組み込みデータベース (ローカル) データ分析など 大量の集計向き 必要な列のみ欲しい時 高速 読み込み形式: CSV,JSON,Parguet…
Wasm(Webassembly)…? 🤔
Wasm…? 😧 バックエンド処理を フロントエンドに埋め込む OSやデバイスに依存しない 様々な言語から コンパイルされる サンドボックス内で 安全に処理
Duckdb+Wasm…? 🤔
Duckdb+Wasm…? 🧐 バックエンド処理 +データベースとの処理を フロントエンドに埋め込む 実質使用言語は Javascript or Typescript +SQL
データ分析用の 大量集計など可能 このままだとデータは消 える
Duckdb+Wasm+OPFS…! 👍 バックエンド処理 +データベースとの処理を フロントエンドに埋め込む 実質使用言語は Javascript or Typescript +SQL
データ分析用の 大量集計など可能 +OPFS ブラウザにデータを永続化 (LocalStrageのようなもの)
React内で アプリが完結 🙌
アプリ構成図 OPFS内 CSV view 👀 ✍
コードの一部紹介 (時間がなかったため...)
気づき ・サーバーサイドがない (クライアントサイドしかない ?) ・バックエンドとの繋ぎこみを考えなくて良いの で作るのが楽 ・SQLはそこまで必要ない ・データ更新時のみS3からデータをとってくるな どAWSとの連携可能? ・
今後検証したいこと 1:セキュリティってほんとに安全? 2:もっと重いデータでもほんとに速い? 3:ストリーミングデータは扱えるの? 4:Postgresqlとの通信ができるの? 5:parquetでどのくらいの規模のデータを扱える の? 6:パフォーマンスチューニングって意味ある の?(キャッシュ等) 7:AWS等で作ったパイプラインとの連携
8:実際のデータに基づいたダッシュボードの改 良 ・