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
WebAssembly 入門
Search
Pine Mizune
September 02, 2016
Programming
6
1.5k
WebAssembly 入門
Gotanda.js #5 in TORETA の発表死霊
Pine Mizune
September 02, 2016
Tweet
Share
More Decks by Pine Mizune
See All by Pine Mizune
多言語対応と絵文字ジェネレーター / i18n of Emoji Generator
pine
0
790
C++ 製グラフィックライブラリ Skia の紹介 / Introduction to the graphics library Skia written by C++
pine
0
1.7k
asyncio + aiohttp で作るウェブサービス / How to develop a web service with asyncio and aiohttp
pine
0
670
Lerna による明示的疎結合アーキテクチャ
pine
1
630
CircleCI 2.0 x JavaScript
pine
3
550
Perl 卒業式
pine
0
340
Android Studio の気になる warnings を抑制する方法まとめ
pine
0
490
Emoji Generator meets Browser Extensions
pine
1
3k
近年の OSS 開発における CI 選択のベストプラクティス
pine
3
4.5k
Other Decks in Programming
See All in Programming
AIのメモリー
watany
11
1.1k
[Codecon - 2025] Como não odiar seus testes
camilacampos
0
100
Quality Gates in the Age of Agentic Coding
helmedeiros
PRO
1
110
CLI ツールを Go ライブラリ として再実装する理由 / Why reimplement a CLI tool as a Go library
ktr_0731
3
720
オンコール⼊⾨〜ページャーが鳴る前に、あなたが備えられること〜 / Before The Pager Rings
yktakaha4
2
1.2k
Vibe Codingの幻想を超えて-生成AIを現場で使えるようにするまでの泥臭い話.ai
fumiyakume
18
9.5k
Android 16KBページサイズ対応をはじめからていねいに
mine2424
0
770
React は次の10年を生き残れるか:3つのトレンドから考える
oukayuka
40
15k
ご注文の差分はこちらですか? 〜 AWS CDK のいろいろな差分検出と安全なデプロイ
konokenj
4
710
The Modern View Layer Rails Deserves: A Vision For 2025 And Beyond @ RailsConf 2025, Philadelphia, PA
marcoroth
2
830
新しいモバイルアプリ勉強会(仮)について
uetyo
1
210
[SRE NEXT] 複雑なシステムにおけるUser Journey SLOの導入
yakenji
0
840
Featured
See All Featured
Embracing the Ebb and Flow
colly
86
4.8k
Speed Design
sergeychernyshev
32
1k
4 Signs Your Business is Dying
shpigford
184
22k
GraphQLとの向き合い方2022年版
quramy
49
14k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.4k
Code Review Best Practice
trishagee
69
19k
How GitHub (no longer) Works
holman
314
140k
Balancing Empowerment & Direction
lara
1
510
How to train your dragon (web standard)
notwaldorf
96
6.1k
Raft: Consensus for Rubyists
vanstee
140
7k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
45
7.5k
Build The Right Thing And Hit Your Dates
maggiecrowley
37
2.8k
Transcript
Pine Mizune Sep 2, 2016 / Gotanda.js #5 WebAssembly 入門
ࣗݾհ o (JU)VC !QJOF o 5XJUUFS!QJOF o ͖ͳݴޠ +BWB4DSJQU o
(PUBOEBKT 0SHBOJ[FS o .PCJMF'BDUPSZ *OD
8FC"TTFNCMZ ͱ – ֓ཁ – ࠷ۙͷಈ ؆୯ͳαϯϓϧίʔυ –
୯७ͳԋࢉ – +BWB4DSJQUͱͷ࿈ܞ ࣍
8FC"TTFNCMZ ͱԿ͔ 8FC"TTFNCMZ ͱ 8FC"TTFNCMZ ͷ࠷ۙͷಈ
ϒϥβ͚ ࣮ߦՄೳόΠφϦϑΥʔϚοτ • +BWB4DSJQUͷସͰͳ͍ • ωΠςΟϒίʔυ $$ ͷ࣮ߦͷ •
$ISPNF'JSFGPY /JHIUMZ Ͱࢼݧతʹ࣮ࡁΈ 8FC"TTFNCMZͱ WebAssembly LLVM compiler C/C++
n $ISPNFɺ8FC,JUɺ'JSFGPYɺ.JDSPTPGU&EHFɺ --7.ɺ6OJUZΒ͕αϙʔτΛද໌ IUUQXXXQVCMJDLFZKQCMPHXFCBTTFNCMZIUNM n 7ɺ'JSFGPYɺ.JDSPTPGU&EHF͕ʮ8FC"TTFNCMZʯ ͷ࣮Λൃද ʢ IUUQXXXQVCMJDLFZKQCMPHWGJSFGPYNJDSPTPGU@FEHFXFC
BTTFNCMZXFCIUNM 8FC"TTFNCMZ ࠷ۙͷಈ
8FC"TTFNCMZ Λͬͨ ؆୯ͳαϯϓϧίʔυ ؆୯ͳԋࢉ 8FC"TTFNCMZ ͔Βͷ +4ͷݺͼग़͠ ˞ιʔείʔυIUUQTHJUIVCDPNQJOFXBTNTBNQMF
8FC"TTFNCMZ Λͬͨ ؆୯ͳαϯϓϧίʔυ ؆୯ͳԋࢉ 8FC"TTFNCMZ ͔Βͷ +4ͷݺͼग़͠
؆୯ͳԋࢉͷྫ$ݴޠͰίʔυΛهड़ int add(int a, int b) { return a +
b; } C/C++ WebAssembly LLVM compiler DMBOHFNJUMMWN UBSHFUXBTN4PBEEMM BEET $ݴޠ
؆୯ͳԋࢉͷྫ--7.*3͔Β "4.ʹม define hidden i32 @add(i32 %a, i32 %b) #0
{ entry: %a.addr = alloca i32, align 4 %b.addr = alloca i32, align 4 store i32 %a, i32* %a.addr, align 4 C/C++ WebAssembly LLVM compiler MMD BEEMM NBSDIXBTNGJMFUZQFBTN rPBEET --7.*3
؆୯ͳԋࢉͷྫ"4.͔Β 4ࣜʹม add: .param i32, i32 .result i32 .local i32
i32.const $push2=, 0 C/C++ WebAssembly LLVM compiler TXBTNBMMPDBUFTUBDLIFMMPT IFMMPXBTU 8FC"TTFNCMZ "4.
؆୯ͳԋࢉͷྫ4͔ࣜΒόΠφϦʹม (func $add (param $0 i32) (param $1 i32) (result
i32) (local $2 i32) (i32.store offset=12 (set_local $2 (i32.sub (i32.load offset=4 C/C++ WebAssembly LLVM compiler TFYQSXBTN rPBEEXBTN BEEXBTU 8"45 8"4.ςΩετܗࣜ
؆୯ͳԋࢉͷྫϒϥβ͔ΒಡΈࠐΈ࣮ߦ fetch('/add.wasm') .then(function (res) { return res.arrayBuffer() }) .then(function (arrayBuffer)
{ const binArray = new Uint8Array(arrayBuffer) const module = Wasm.instantiateModule(binArray, {}) console.log(module.exports.add(5, 8)) }) +BWB4DSJQU
8FC"TTFNCMZ Λͬͨ ؆୯ͳαϯϓϧίʔυ ؆୯ͳԋࢉ 8FC"TTFNCMZ ͔Βͷ +4ͷݺͼग़͠
+4Λ 8FC"TTFNCMZ ͔Βݺͼग़͢$ݴޠଆ void alert(char *s); void hello() { alert("Hello
World!¥n"); } $ݴޠ 未解決 ϦϯΫ࣌ʹղܾ͞Εͳ͍ؔ +BWB4DSJQUݺͼग़͠ʹίϯύΠϧ͞ΕΔ
const module = Wasm.instantiateModule(binArray, { env: { alert: function (ptr)
{ const memory = new Uint8Array(module.exports.memory) const str = cstr2str(memory, ptr) console.log(str) }, }, }) module.exports.hello() +BWB4DSJQU ΞυϨε͕Δ θϩऴจࣈྻ ͔Βͷมॲཧ ୈ Ҿʹ ؔҰཡΛ͢ +4Λ 8FC"TTFNCMZ ͔Βݺͼग़͢+4ଆ
function cstr2str(buf, pos) { var s = ’’ while (buf.length
> pos && buf[pos] != 0) { s += String.fromCharCode(buf[pos]) ++pos } return s } +BWB4DSJQU 6JOU"SSBZ͔Β θϩऴจࣈྻΛऔΓग़ͯ͠Δ͚ͩ +4Λ 8FC"TTFNCMZ ͔Βݺͼग़͢+4ଆ
·ͱΊ ü 8FC"TTFNCMZ طʹϒϥβͰಈ͘ ü ਖ਼ࣜͳن֨ʹͳΔͷ·ͩઌ ü ڵຯͷ͋Δํ৮ͬͯΈ͍ͯͩ͘͞
FIN