Ruby Wasmのおさらいと活用方法を探る / After-Rubykaigi-2022-ruby-wasm

Slide 1

Slide 1 text

3VCZ8BTNͷ ͓͞Β͍ͱ׆༻ํ๏Λ୳Δ "GUFS3VCZ,BJHJ

Slide 2

Slide 2 text

ࣗݾ঺հ w ϧχ   ɹ5XJUUFS!MOJ@5 w .FE1FFS&OHJOFFS ʙ w ຊۀ͸4QMBUPPO͓͡͞Μ w ޷͖ͳ3BJMTͷϝιου   QSFTFODF w ݏ͍ͳ3BJMTͷϝιου   BDDFQUT@OFTUFE@BUUSJCVUFT@GPS

Slide 3

Slide 3 text

$-*/*$4VQQPSU ҩࢣͷ։ۀࢧԉ

Slide 4

Slide 4 text

.FE1FFS$BSFFS ҩࢣͷస৬ࢧԉ

Slide 5

Slide 5 text

ຊ೔ͷςʔϚ IUUQTSVCZLBJHJPSHQSFTFOUBUJPOTLBUFJOPJHBLVLVOIUNM

Slide 6

Slide 6 text

3VCZ8FC"TTFNCMZ 3VCZ1SFWJFXϦϦʔε 3VCZ1SFWJFXϦϦʔε

Slide 7

Slide 7 text

8FC"TTFNCMZ

Slide 8

Slide 8 text

8FC"TTFNCMZ 8BTN Ϟμϯϒϥ΢βͰಈ࡞͢Δ   όΠφϦίʔυͷ৽͍͠ϑΥʔϚοτ ಛ௃ ߴύϑΥʔϚϯε 1PSUBCMF ಛఆͷݴޠʹґଘ͠ͳ͍ 4BOECPY؀ڥͳͲͰ҆શʹ࣮ߦͰ͖Δ

Slide 9

Slide 9 text

Ұൠతͳ8BTN࣮ߦϑϩʔ $$ 4XJGU 3VTU (P XBTN ϒϥ΢β

Slide 10

Slide 10 text

3VCZͷ8BTN࣮ߦϑϩʔ SVCZXBTN 3VCZΠϯλϓϦλ $3VCZ ϒϥ΢β BQQSC

Slide 11

Slide 11 text

؆୯ʹ3VCZ͸ಈ͔ͳ͍ʜ ඪ४ͷ8FC"TTFNCMZʹ͸ʜ ϑΝΠϧγεςϜ͕ͳ͍ γεςϜΫϩοΫ͕ͳ͍ ωοτϫʔΫ͕ͳ͍ ྫ   5JNFOPXɹˡฦ͢஋͕ͳ͍ʂʂʂ

Slide 12

Slide 12 text

؆୯ʹ3VCZ͸ಈ͔ͳ͍ʜ +4Ͱ8FC"TTFNCMZʹؔ਺Λఏڙ͢Δ 5JNFOPX ˣ DMPDL@HFUUJNF ˣ %BUFOPX XBTN KT

Slide 13

Slide 13 text

΋͏ͻͱͭͷཁૉ 8"4*

Slide 14

Slide 14 text

ߴ·Δχʔζ ʮ༷ʑͳ؀ڥʯͰ   ʮ҆શʯ͔ͭʮޮ཰తʯʹ   ϓϩάϥϜΛಈ͔͍ͨ͠ʂʂ 8FCҎ֎ʹ΋ҰൠతͳΞϓϦͰٻΊΒΕ͍ͯΔ

Slide 15

Slide 15 text

8"4*ϕʔεͱ͸ 8FC"TTFNCMZ4ZTUFN*OUFSGBDF 8"4* ϑΝΠϧγεςϜ΁ͷΞΫηεͳͲ   04ʹґଘ͢ΔγεςϜίʔϧͳͲΛந৅Խ͢Δ࢓༷ 8BTN3VOUJNF 7. )PTU4ZTUFN 8"4*

Slide 16

Slide 16 text

8"4*ϕʔεͱ͸ 8FC"TTFNCMZࣗମ͸γεςϜΠϯλʔϑΣΠεΛ   ࣋ͨͳ͍7.ͷ্Ͱ࣮ߦ͞ΕΔ 8"4*͸͜ΕΛن֨Խ͢Δ 8BTN3VOUJNF 7. )PTU4ZTUFN 8"4*

Slide 17

Slide 17 text

8"4*7'4

Slide 18

Slide 18 text

8"4*7'4 Ծ૝ϑΝΠϧγεςϜ 7'4 Λ8"4*্ʹ࣮૷ ϑΝΠϧૢ࡞͕Ͱ͖ͳ͍؀ڥͰ΋   ϑΝΠϧγεςϜ͔ΒͷಡΈࠐΈ͕Ͱ͖ΔΑ͏ʹ Ծ૝ϑΝΠϧγεςϜʹʮSCʯΛຒΊࠐΜͰ͓͚͹   ։ൃऀ͸γϯάϧϑΝΠϧͰͷόΠφϦΛੜ੒Ͱ͖Δʂ

Slide 19

Slide 19 text

ͳΜ͔͍͢͝࢓૊Έ͕ ࣮૷͞Εͱͬͨʂ

Slide 20

Slide 20 text

ɹΠϯετʔϧͳ͠ʹ 3VCZ͕ಈ͘Α͏ʹͳͬͨ Ϟμϯϒϥ΢β֤छ $ISPNF 'JSFGPY &EHF 8FC"TTFNCMZରԠ؀ڥ Τοδ؀ڥ 'BTUMZ $MPVE fl BSF

Slide 21

Slide 21 text

ɹΠϯετʔϧͳ͠ʹ 3VCZ͕ಈ͘Α͏ʹͳͬͨ ˞ϒϥ΢βͰಈ͘3VCZͷઌഐʹʮ0QBMʯ͕ଘࡏ͢Δ ͪ͜Β͸3VCZΛ+BWB4DSJQUʹม׵͢ΔίϯύΠϥ

Slide 22

Slide 22 text

ଞɺٕज़తͳ೉ॴ͸ ݩͷൃදࢿྉΛࢀরʂ ಉ͡࿩ͯ͠΋ ͍Έͳ͍͔ΒͶ

Slide 23

Slide 23 text

׆༻

Slide 24

Slide 24 text

׆༻ IUUQTSVCZQV[[MFTDPPLQBEUFDI

Slide 25

Slide 25 text

׆༻ 3VCZϦϑΝϨϯε্Ͱ3VCZΛ࣮ߦͰ͖ΔΑ͏ʹ͢Δ

Slide 26

Slide 26 text

࣮ࡍʹ࢖ͬͯΈΑ͏ʂ

Slide 27

Slide 27 text

3VCZ8BTNΛखݩͰ ࢼ͠·͔ͨ͠ʁ ͸͍ :FT

Slide 28

Slide 28 text

؆୯ʹࢼͤΔͧʂ

Slide 29

Slide 29 text

HJUIVCDPNSVCZSVCZXBTN ૣ଎DMPOF͠Α͏ʂ

Slide 30

Slide 30 text

஫)5.-ͰࢼͤΔαϯϓϧ͕ ਂΊͷσΟϨΫτϦʹ͋Δ IUUQTHJUIVCDPNSVCZSVCZXBTNUSFFNBJO QBDLBHFTOQNQBDLBHFTSVCZXBTNXBTJFYBNQMF IUUQTHJUIVCDPNSVCZSVCZXBTNUSFFNBJO QBDLBHFTOQNQBDLBHFTSVCZIFBEXBTNXBTJ

Slide 31

Slide 31 text

ಈ͔ͯ͠ΈΑ͏

Slide 32

Slide 32 text

puts "Hello, world!"

Slide 33

Slide 33 text

w OQNͰఏڙ͞Ε͍ͯΔTDSJQUΛಡΈࠐΉ w SVCZΛॻ͘ w Ҏ্ʂ

Slide 34

Slide 34 text

% FN P w IUUQTMOJUHJUIVCJPSVCZXBTNQBHFTEFNP

Slide 35

Slide 35 text

3VCZαʔόʔ͍Βͣʂ

Slide 36

Slide 36 text

੩తϑΝΠϧΛϗετ Ͱ͖Ε͹3VCZΛಈ͔ͤΔ

Slide 37

Slide 37 text

͞Βʹ+4͕ѻ͑Δ

Slide 38

Slide 38 text

+4Λѻ͏ require "js" document = JS.global[:document]

Slide 39

Slide 39 text

% FN P w IUUQTMOJUHJUIVCJPSVCZXBTNQBHFTEFNP

Slide 40

Slide 40 text

+4Λѻ͏ require "js" window = JS.global[:window] window.alert "Hello, world!"

Slide 41

Slide 41 text

+4Λѻ͏ loop do window.alert "Hello, world!" end

Slide 42

Slide 42 text

% FN P w IUUQTMOJUHJUIVCJPSVCZXBTNQBHFTEFNP

Slide 43

Slide 43 text

͋Γ͑ͦ͏ͳ࢓༷Λ 3VCZͰॻ͍ͯΈΑ͏

Slide 44

Slide 44 text

% FN P w IUUQTMOJUHJUIVCJPSVCZXBTNQBHFTEFNP

Slide 45

Slide 45 text

ը໘ଆͷ όϦσʔγϣϯʂ

Slide 46

Slide 46 text

Ͱ΋ɺ͜Ε͘Β͍ͳΒ +4Ͱॻ͚ͦ͏ʜ ͏ʔΜ

Slide 47

Slide 47 text

΍΍೉ղͳ όϦσʔγϣϯͳΒʁ

Slide 48

Slide 48 text

ྫϚΠφϯόʔ

Slide 49

Slide 49 text

ϚΠφϯόʔ ܻͷ਺ࣈ 999999999999 ेҰܻͷ൪߸ٴͼͦͷޙʹ෇͞ΕͨҰܻͷݕࠪ༻਺ࣈ ࠷ޙඌͷܻ͸νΣοΫσΟδοτ ܻ਺νΣοΫσΟδοτ͕߹͍ͬͯΕ͹Α͍

Slide 50

Slide 50 text

ϚΠφϯόʔ

Slide 51

Slide 51 text

ϚΠφϯόʔ def valid_digit?(value) digits = value.to_s.chars.map(&:to_i) return false if digits.length != 12 check_digit = digits.pop digits.reverse! mods = (1..11).sum do |n| pn = digits[n - 1] qn = n <= 6 ? n + 1 : n - 5 pn * qn end % 11 calced_check_digit = mods <= 1 ? 0 : 11 - mods check_digit == calced_check_digit end

Slide 52

Slide 52 text

+4Ҡ২͠ΜͲ͍ ͔΋͠Εͳ͍

Slide 53

Slide 53 text

% FN P w IUUQTMOJUHJUIVCJPSVCZXBTNQBHFTEFNP

Slide 54

Slide 54 text

3VCZͰॻ͚Δʂ

Slide 55

Slide 55 text

+4΋ѻ͑Δ͔Β ԿͰ΋Ͱ͖ͦ͏ͩͳ͊

Slide 56

Slide 56 text

ԿͰ΋Ͱ͖ͦ͏ͳʜ

Slide 57

Slide 57 text

ϝΠϯϧʔϓΛ࡞ͬͯʜ vm.eval(` $scene = MainScene.new `) async function main( tFrame ) { const stopMain = window.requestAnimationFrame( main ); vm.eval(` $scene.main `) prevFrame = tFrame; }

Slide 58

Slide 58 text

% FN P w IUUQTMOJUHJUIVCJPSVCZXBTNQBHFTEFNP w IUUQTMOJUHJUIVCJPSVCZXBTNQBHFTFOHJOF

Slide 59

Slide 59 text

ήʔϜΤϯδϯ ͭ͘Εͦ͏ʂ

Slide 60

Slide 60 text

ΈΜͳ΋8BTN ࢼͯ͠ΈΑ͏ ͨͷ͍͠Α

Slide 61

Slide 61 text

͓ΘΓʹ 3VCZͰ͸8FC"TTFNCMZ͓Αͼ8"4*΁ͷ   ରԠ͕༧ఆ͞Ε͍ͯΔ SVCZXBTN͸OQNύοέʔδ΍   ίϯύΠϧࡁ3VCZͰ഑෍͞ΕΔ

Slide 62

Slide 62 text

͓ΘΓʹ ֦ுϥΠϒϥϦΛಉࠝ͢Δͱ   ϑΝΠϧαΠζ͕େ͖͘ͳ͍ͬͯ͘՝୊΋ ͔͠͠3VCZͷศརͳϥΠϒϥϦ͸࢖͍͍ͨʜ HFNͳͲ΋औΓѻ͑ΔΑ͏ʹͳΔͷ͔ ࠓޙ͕ͨͷ͠Έʂ