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
20250228-create-npm-package-with-wasm
Search
kazto
February 28, 2025
Programming
1
68
20250228-create-npm-package-with-wasm
kazto
February 28, 2025
Tweet
Share
More Decks by kazto
See All by kazto
C言語でオブジェクト指向プログラミング / object-oriented-in-c
kazto
1
860
Golangでwget劣化クローンをつくる / wget clone with golang
kazto
1
490
登壇を応援する会忘年LT_今からやぞ_.pdf
kazto
2
4.4k
Other Decks in Programming
See All in Programming
イベントストーミング図からコードへの変換手順 / Procedure for Converting Event Storming Diagrams to Code
nrslib
1
580
Code as Context 〜 1にコードで 2にリンタ 34がなくて 5にルール? 〜
yodakeisuke
0
120
設計やレビューに悩んでいるPHPerに贈る、クリーンなオブジェクト設計の指針たち
panda_program
6
1.8k
データの民主化を支える、透明性のあるデータ利活用への挑戦 2025-06-25 Database Engineering Meetup#7
y_ken
0
340
5つのアンチパターンから学ぶLT設計
narihara
1
140
iOS 26にアップデートすると実機でのHot Reloadができない?
umigishiaoi
0
100
AI時代のソフトウェア開発を考える(2025/07版) / Agentic Software Engineering Findy 2025-07 Edition
twada
PRO
14
1.7k
PipeCDのプラグイン化で目指すところ
warashi
1
240
アンドパッドの Go 勉強会「 gopher 会」とその内容の紹介
andpad
0
290
PicoRuby on Rails
makicamel
2
120
技術同人誌をMCP Serverにしてみた
74th
1
530
LT 2025-06-30: プロダクトエンジニアの役割
yamamotok
0
670
Featured
See All Featured
Code Review Best Practice
trishagee
69
18k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
30
2.1k
Site-Speed That Sticks
csswizardry
10
670
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
Building Adaptive Systems
keathley
43
2.6k
Visualization
eitanlees
146
16k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
1.8k
Raft: Consensus for Rubyists
vanstee
140
7k
Documentation Writing (for coders)
carmenintech
72
4.9k
Making Projects Easy
brettharned
116
6.3k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
161
15k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
46
9.6k
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みたいなしくみな いらしいですね