Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Duckdb-Wasmでローカルダッシュボードを作ってみた
Search
nk
November 02, 2024
Programming
0
140
Duckdb-Wasmでローカルダッシュボードを作ってみた
nk
November 02, 2024
Tweet
Share
Other Decks in Programming
See All in Programming
Macとオーディオ再生 2024/11/02
yusukeito
0
390
TypeScript Graph でコードレビューの心理的障壁を乗り越える
ysk8hori
3
1.2k
ペアーズにおけるAmazon Bedrockを⽤いた障害対応⽀援 ⽣成AIツールの導⼊事例 @ 20241115配信AWSウェビナー登壇
fukubaka0825
6
2.1k
광고 소재 심사 과정에 AI를 도입하여 광고 서비스 생산성 향상시키기
kakao
PRO
0
180
romajip: 日本の住所CSVデータを活用した英語住所変換ライブラリを作った話
sangunkang
0
900
Nurturing OpenJDK distribution: Eclipse Temurin Success History and plan
ivargrimstad
0
1.2k
ローコードSaaSのUXを向上させるためのTypeScript
taro28
1
680
TypeScriptでライブラリとの依存を限定的にする方法
tutinoko
3
750
イマのCSSでできる インタラクション最前線 + CSS最新情報
clockmaker
5
3.2k
聞き手から登壇者へ: RubyKaigi2024 LTでの初挑戦が 教えてくれた、可能性の星
mikik0
1
140
3 Effective Rules for Using Signals in Angular
manfredsteyer
PRO
0
130
エンジニアとして関わる要件と仕様(公開用)
murabayashi
0
320
Featured
See All Featured
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.3k
The Cost Of JavaScript in 2023
addyosmani
45
6.8k
[RailsConf 2023] Rails as a piece of cake
palkan
52
4.9k
A designer walks into a library…
pauljervisheath
204
24k
4 Signs Your Business is Dying
shpigford
180
21k
Rebuilding a faster, lazier Slack
samanthasiow
79
8.7k
How to Ace a Technical Interview
jacobian
276
23k
How to train your dragon (web standard)
notwaldorf
88
5.7k
Building Better People: How to give real-time feedback that sticks.
wjessup
364
19k
We Have a Design System, Now What?
morganepeng
50
7.2k
Keith and Marios Guide to Fast Websites
keithpitt
409
22k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
365
24k
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:実際のデータに基づいたダッシュボードの改 良 ・