$30 off During Our Annual Pro Sale. View Details »
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
20250228-create-npm-package-with-wasm
Search
kazto
February 28, 2025
Programming
1
110
20250228-create-npm-package-with-wasm
kazto
February 28, 2025
Tweet
Share
More Decks by kazto
See All by kazto
TUIライブラリつくってみた / i-just-make-TUI-library
kazto
1
400
アイカツ!から学ぶビジネスパーソンとしての姿勢 / learn-the-attitude-of-businessperson-from-aikatsu
kazto
0
590
C言語でオブジェクト指向プログラミング / object-oriented-in-c
kazto
1
910
Golangでwget劣化クローンをつくる / wget clone with golang
kazto
1
520
登壇を応援する会忘年LT_今からやぞ_.pdf
kazto
2
4.5k
Other Decks in Programming
See All in Programming
Context is King? 〜Verifiability時代とコンテキスト設計 / Beyond "Context is King"
rkaga
10
1.3k
Navigating Dependency Injection with Metro
l2hyunwoo
1
150
ゆくKotlin くるRust
exoego
1
110
バックエンドエンジニアによる Amebaブログ K8s 基盤への CronJobの導入・運用経験
sunabig
0
170
脳の「省エネモード」をデバッグする ~System 1(直感)と System 2(論理)の切り替え~
panda728
PRO
0
110
tsgolintはいかにしてtypescript-goの非公開APIを呼び出しているのか
syumai
7
2.3k
Full-Cycle Reactivity in Angular: SignalStore mit Signal Forms und Resources
manfredsteyer
PRO
0
150
大体よく分かるscala.collection.immutable.HashMap ~ Compressed Hash-Array Mapped Prefix-tree (CHAMP) ~
matsu_chara
2
220
ZJIT: The Ruby 4 JIT Compiler / Ruby Release 30th Anniversary Party
k0kubun
0
120
20251212 AI 時代的 Legacy Code 營救術 2025 WebConf
mouson
0
200
リリース時」テストから「デイリー実行」へ!開発マネージャが取り組んだ、レガシー自動テストのモダン化戦略
goataka
0
130
TestingOsaka6_Ozono
o3
0
170
Featured
See All Featured
Neural Spatial Audio Processing for Sound Field Analysis and Control
skoyamalab
0
130
Stop Working from a Prison Cell
hatefulcrawdad
273
21k
Visual Storytelling: How to be a Superhuman Communicator
reverentgeek
2
390
Game over? The fight for quality and originality in the time of robots
wayneb77
1
61
Mobile First: as difficult as doing things right
swwweet
225
10k
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
reverentgeek
1
290
Agile Actions for Facilitating Distributed Teams - ADO2019
mkilby
0
86
Noah Learner - AI + Me: how we built a GSC Bulk Export data pipeline
techseoconnect
PRO
0
72
Introduction to Domain-Driven Design and Collaborative software design
baasie
1
500
Git: the NoSQL Database
bkeepers
PRO
432
66k
How to make the Groovebox
asonas
2
1.8k
Hiding What from Whom? A Critical Review of the History of Programming languages for Music
tomoyanonymous
0
290
Transcript
WASMをビルドして npmパッケージにする (個人的な作業進捗を添えて) 2025/02/28 新宿御苑.wasm kazto_dev
自己紹介 • 横浜のSIerで働いている多摩地区在住 • 仕事ではマルチスタックと言う名のなんでも屋 ◦ メインはサーバサイド ◦ フロントエンドちょこっと ◦
Flutterスマホアプリちょこっと ◦ AWSちょこっと • 自社で一番WASMとZigとCloudflareを語れる人になりたい
やりたいこと • 昨年末のアドベントカレンダーでこんなん書きました
やりたいこと • fzfの検索で、migemo風にローマ字で日本語検索できたら便利そう • 本丸は、CLI • npmパッケージにして、フロントエンドとかでも使えたりしないか? ◦ fzfもmigemoもGolang実装だし、WASMで配布できるのでは?
おおまかなステップ • 簡単なWASMをビルドしてnpmパッケージにする • npm installして使えることを確認する • 使いたい外部パッケージ (gomigemo, fzf)
をWASMビルドする • どれをどう呼んだら連結させられるか(たぶんここまではまだ行けない)
簡単なWASMをビルドしてnpmパッケージにする • 右のような簡単なソースをつくる • GOOS=js GOARCH=wasm go build -o add.wasm
add.go main.go
npmパッケージをつくる • ./dist/ ディレクトリに下記を置く ◦ add.wasm ◦ $(go env GOROOT)/misc/wasm/wasm_exec.js
◦ index.js (右記) • npm publish
・・・結果
時間切れ • お目汚し失礼いたしました🙇 • さきほど知ったんですが、WASMにはまだDynamic Link Libraryみたいなしくみな いらしいですね