Upgrade to Pro — share decks privately, control downloads, hide ads and more …

WebAssembly 入門

842aaadff6e13fbf372c9b17b49b031c?s=47 Pine Mizune
September 02, 2016

WebAssembly 入門

Gotanda.js #5 in TORETA の発表死霊

842aaadff6e13fbf372c9b17b49b031c?s=128

Pine Mizune

September 02, 2016
Tweet

Transcript

  1. Pine Mizune Sep 2, 2016 / Gotanda.js #5 WebAssembly 入門

  2. ࣗݾ঺հ o (JU)VC !QJOF o 5XJUUFS!QJOF o ޷͖ͳݴޠ +BWB4DSJQU o

    (PUBOEBKT 0SHBOJ[FS o .PCJMF'BDUPSZ *OD
  3.  8FC"TTFNCMZ ͱ͸ – ֓ཁ – ࠷ۙͷಈ޲  ؆୯ͳαϯϓϧίʔυ –

    ୯७ͳԋࢉ – +BWB4DSJQUͱͷ࿈ܞ ໨࣍
  4. 8FC"TTFNCMZ ͱ͸Կ͔  8FC"TTFNCMZ ͱ͸  8FC"TTFNCMZ ͷ࠷ۙͷಈ޲

  5. ϒϥ΢β޲͚ ࣮ߦՄೳόΠφϦϑΥʔϚοτ • +BWB4DSJQUͷ୅ସͰ͸ͳ͍ • ωΠςΟϒίʔυ $$ ͷ࣮ߦ଎౓ͷ  •

    $ISPNF'JSFGPY /JHIUMZ Ͱࢼݧతʹ࣮૷ࡁΈ 8FC"TTFNCMZͱ͸ WebAssembly LLVM compiler C/C++
  6. n $ISPNFɺ8FC,JUɺ'JSFGPYɺ.JDSPTPGU&EHFɺ --7.ɺ6OJUZΒ͕αϙʔτΛද໌  IUUQXXXQVCMJDLFZKQCMPHXFCBTTFNCMZIUNM n 7ɺ'JSFGPYɺ.JDSPTPGU&EHF͕ʮ8FC"TTFNCMZʯ ͷ࣮૷Λൃද ʢ IUUQXXXQVCMJDLFZKQCMPHWGJSFGPYNJDSPTPGU@FEHFXFC

    BTTFNCMZXFCIUNM 8FC"TTFNCMZ ࠷ۙͷಈ޲
  7. 8FC"TTFNCMZ Λ࢖ͬͨ ؆୯ͳαϯϓϧίʔυ  ؆୯ͳԋࢉ  8FC"TTFNCMZ ͔Βͷ +4ͷݺͼग़͠ ˞ιʔείʔυIUUQTHJUIVCDPNQJOFXBTNTBNQMF

  8. 8FC"TTFNCMZ Λ࢖ͬͨ ؆୯ͳαϯϓϧίʔυ  ؆୯ͳԋࢉ  8FC"TTFNCMZ ͔Βͷ +4ͷݺͼग़͠

  9. ؆୯ͳԋࢉͷྫ$ݴޠͰίʔυΛهड़ int add(int a, int b) { return a +

    b; } C/C++ WebAssembly LLVM compiler DMBOHFNJUMMWN UBSHFUXBTN4PBEEMM BEET $ݴޠ
  10. ؆୯ͳԋࢉͷྫ--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
  11. ؆୯ͳԋࢉͷྫ"4.͔Β 4ࣜʹม׵ add: .param i32, i32 .result i32 .local i32

    i32.const $push2=, 0 C/C++ WebAssembly LLVM compiler TXBTNBMMPDBUFTUBDLIFMMPT IFMMPXBTU 8FC"TTFNCMZ "4.
  12. ؆୯ͳԋࢉͷྫ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.ςΩετܗࣜ
  13. ؆୯ͳԋࢉͷྫϒϥ΢β͔ΒಡΈࠐΈ࣮ߦ 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
  14. 8FC"TTFNCMZ Λ࢖ͬͨ ؆୯ͳαϯϓϧίʔυ  ؆୯ͳԋࢉ  8FC"TTFNCMZ ͔Βͷ +4ͷݺͼग़͠

  15. +4Λ 8FC"TTFNCMZ ͔Βݺͼग़͢$ݴޠଆ void alert(char *s); void hello() { alert("Hello

    World!¥n"); } $ݴޠ 未解決 ϦϯΫ࣌ʹղܾ͞Εͳ͍ؔ਺͸ +BWB4DSJQUݺͼग़͠ʹίϯύΠϧ͞ΕΔ
  16. 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ଆ
  17. 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ଆ 
  18. ·ͱΊ ü 8FC"TTFNCMZ ͸طʹϒϥ΢βͰಈ͘ ü ਖ਼ࣜͳن֨ʹͳΔͷ͸·ͩઌ ü ڵຯͷ͋Δํ͸৮ͬͯΈ͍ͯͩ͘͞

  19. FIN