Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
それは残像だ
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
yhara
June 29, 2019
Programming
4.7k
4
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
それは残像だ
http://regional-gh.rubykaigi.org/tochigi08/
yhara
June 29, 2019
More Decks by yhara
See All by yhara
静的型付けプログラミング言語Shiika
yhara
0
20k
スモートーク
yhara
0
3.1k
Ovto: Frontend web framework for Rubyists
yhara
0
7.9k
Ruby, Opal and WebAssembly
yhara
2
2.9k
Competitive Programming in Ruby (101)
yhara
0
790
Rubyで競技プログラミング(入門編)
yhara
0
2k
良いデバッグログはプロジェクトの資産である
yhara
55
19k
Let's make a functional language!
yhara
0
6.5k
Recent Updates (近況報告)
yhara
0
710
Other Decks in Programming
See All in Programming
AIエージェント時代のコードレビューを設計する
nogu66
6
2.7k
App Intentsのビルドプロセスを支える技術
kntkymt
0
390
From 6 People Classroom Meetup to 100 People Regional Conference / FOSS4G Hiroshima 2026
furukawayasuto
0
210
速習iPhone Duo対応
yuukiw00w
1
540
速く作れる。その次は、速く確かめられる開発へ 〜AIネイティブ開発を支える、Shift Down〜 / Can build fast. Next, moving to development where we can verify fast.
rkaga
5
3.2k
スマートフォンでモールス信号を送受信する 〜スマートフォンのLEDとカメラで作る光通信の設計と実装〜
atsuki_seo
0
130
【高い買い物LT会】初任給で話題の国産フィジカルAIを買った話
akagami
PRO
0
160
『寄り添うラジオ』をAIで作る 体験価値から逆算した、会話しないUXと品質設計
theoriatec2024
3
180
フロントエンドUIフレームワークのこれまでとこれから
ssssota
5
2.8k
一人だけ、Kiroが静止する日
hideg
0
110
Snowflakeで業務アプリを作ろう。 Snowflakeのアプリ機能解説&実践ガイド
ayumu_yamaguchi
1
280
C#の現在地 進化の歴史と、AI時代の.NET Everywhere
neuecc
4
2.2k
Featured
See All Featured
The SEO identity crisis: Don't let AI make you average
varn
0
560
Leo the Paperboy
mayatellez
10
2.3k
AI Search: Implications for SEO and How to Move Forward - #ShenzhenSEOConference
aleyda
1
1.4k
Amusing Abliteration
ianozsvald
1
300
Faster Mobile Websites
deanohume
310
32k
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.8k
Java REST API Framework Comparison - PWX 2021
mraible
34
9.7k
Kristin Tynski - Automating Marketing Tasks With AI
techseoconnect
PRO
0
520
Highjacked: Video Game Concept Design
rkendrick25
PRO
1
460
Building a Modern Day E-commerce SEO Strategy
aleyda
45
9.2k
brightonSEO & MeasureFest 2025 - Christian Goodrich - Winning strategies for Black Friday CRO & PPC
cargoodrich
3
840
Bootstrapping a Software Product
garrettdimon
PRO
306
120k
Transcript
ͦΕ૾ͩ @yhara (Yutaka Hara) 2019/6/29 ͱͪ͗Rubyձٞ08
About me • @yhara (Yutaka Hara) • https://yhara.jp • NaCl
দߐຊࣾ
ʰRubyͰ࡞Δحົͳϓϩάϥϛϯάݴޠʱ
֓ཁ Zanzouͱ͍͏gemΛ࡞Γ·ͨ͠ɻ ZanzouɺΦϒδΣΫτͷʮҰ෦͚ͩॻ͖ ͑ͨͭʯΛ؆୯ʹ࡞ΔͨΊͷgemͰ͢ɻ
Agenda 1. Zanzouͱ 2. ZanzouͷΞϧΰϦζϜ 3. Zanzouͷ࣮ͱ
1. Zanzouͱ Zanzou4݄ͷRubyKaigiͰൃදͨ͠Ovtoͱ͍ ͏WebϑϨʔϜϫʔΫͷͨΊʹ࡞Γ·ͨ͠ɻ https://github.com/yhara/ovto
IUUQTSVCZLBJHJPSHQSFTFOUBUJPOTZIBSBIUNM
ཁ • RubyͰϒϥβΞϓϦΛ࡞ΕΔϑϨʔϜϫʔ ΫΛ࡞ͬͨ • RubyͰը໘ͷఆٛΛॻ͘ˠOpalͰJavaScript ʹม͢Δˠϒϥβ্Ͱಈ͘
Ovtoͷ͘͠Έ • app.stateͱ͍͏ΦϒδΣΫτʹΞϓϦͷશঢ়ଶ͕ೖ͍ͬͯ Δ • state͕มԽͨ͠Βը໘Λߋ৽͢Δ • ʮมԽ͔ͨ͠ʯΛݕࠪ͢Δʹɺݩͷঢ়ଶ͕ඞཁ • ʮগ͠มߋͨ͠ͷʯΛ࡞Δͷ͕ͪΐͬͱ໘
• JSͰͲ͏ͳΜͩΖ͏ʁˠimmer.jsͱ͍͏ͷ͕͋ΔΒ͠ ͍ˠԿ͜Ε໘ന͍ɺRubyʹҠ২Ͱ͖ͳ͍͔ͳ
ྫ todos = [ {id: 1, title: "ཛΛങ͏", done: false},
{id: 2, title: "আػΛ͔͚Δ", done: false}, ] ͜͜ΛUSVFʹ͍ͨ͠ͱ͢Δ
୯७ʹΔͱ͜͏ todos = [ {id: 1, title: "ཛΛങ͏", done: false},
{id: 2, title: "আػΛ͔͚Δ", done: false}, ] todos[1][:done] = true ͜͜ΛUSVFʹ͍ͨ͠ͱ͢Δ
todosΛॻ͖͑ͨ͘ͳ͍࣌ʁ todos = [ {id: 1, title: "ཛΛങ͏", done: false},
{id: 2, title: "আػΛ͔͚Δ", done: false}, ] new_todos = todos.map{|x| if x[:id] == 2 x.merge(done: true) else x end } ͜͜ΛUSVFʹ͍ͨ͠ͱ͢Δ
ཧɹɹɹɹݱ࣮ new_todos = todos.map{|x| if x[:id] == 2 x.merge(done: true)
else x end } todos[1][:done] = true
zanzouΛ͏ͱ todos = [ {id: 1, title: "ཛΛങ͏", done: false},
{id: 2, title: "আػΛ͔͚Δ", done: false}, ] require 'zanzou' new_todos = Zanzou.with_updates(todos) do |shadow_todos| shadow_todos[1][:done] = true } ͜͜ΛUSVFʹ͍ͨ͠ͱ͢Δ ˢʮ൪ͷEPOFΛUSVFʹ͢Δʯ͕ͦͷ··ॻ͚Δ ͔ͭΦϦδφϧແࣄ
໊લͷ༝དྷ
None
͔ͬͨʂʁ
૾ͩʜ ͳʹͬ
ΦϒδΣΫτ ഁյతૢ࡞ ϓϩάϥϜ
ରΛૢ࡞͍ͯ͠ΔΑ͏͚ͩͲɺ ݩͷΦϒδΣΫτແࣄ (૾ͳͷͰ) ΦϒδΣΫτ ഁյతૢ࡞ ϓϩάϥϜ ࣮ߦ݁Ռ
2. ZanzouͷΞϧΰϦζϜ ͜ͷΑ͏ͳಈ࡞Λ࣮ݱ͢ΔʹͲ͏͢ΕΑ͍Ͱ͠ΐ͏͔ʁ ZanzouͷΈɺimmer.jsͱ͍͏JavaScriptͷϥΠϒϥ ϦΛࢀߟʹ͍ͯ͠·͢ɻ https://github.com/immerjs/immer
Ұ൪ʮ؆୯ʯͳΓํɹ • ΦϒδΣΫτશମΛෳ͢Δ • ෳͨ͠ͷΛมߋͤ͞Δ • ɿ͍
ྫɿશ෦ෳͯ͠͠·͑ಈ͚͘ Ͳ… UPEPT<> OFX@UPEPT<> 5PEPJE EPOFGBMTF
5PEPJE EPOFGBMTF 5PEPJE EPOFGBMTF 5PEPJE EPOFGBMTF 5PEPJE EPOFGBMTF 5PEPJE EPOFUSVF 5PEPJE EPOFGBMTF 5PEPJE EPOFGBMTF
UPEPT<> OFX@UPEPT<> ڞ༗Ͱ͖Δͱ͜Ζڞ༗͍ͨ͠ 5PEPJE EPOFGBMTF 5PEPJE
EPOFGBMTF 5PEPJE EPOFGBMTF 5PEPJE EPOFGBMTF 5PEPJE EPOFUSVF
खॱ̍ɿϧʔτShadowΛ࡞Δ "SSBZ ͱͷ ΦϒδΣΫτ ૾ 4IBEPX )BTI )BTI GBMTF
GBMTF "SSBZ 4IBEPX JE EPOF JE EPOF TIBEPX<><EPOF>USVF
ઓུ̎ɿࢀর͞ΕͨΒShadowΛฦ͢ "SSBZ ͱͷ ΦϒδΣΫτ ૾ 4IBEPX )BTI )BTI GBMTF
GBMTF "SSBZ 4IBEPX JE EPOF JE EPOF TIBEPX<><EPOF>USVF )BTI 4IBEPX
ઓུ̏ɿॻ͖͑ΒΕͨΒͦͷ͜ͱΛ ͓֮͑ͯ͘ "SSBZ ͱͷ ΦϒδΣΫτ ૾ 4IBEPX )BTI )BTI
GBMTF GBMTF "SSBZ 4IBEPX JE EPOF JE EPOF TIBEPX<><EPOF>USVF )BTI 4IBEPX EPOFΛ USVFʹ͢Δ
ઓུ̐ɿϑΝΠφϥΠζ "SSBZ ͱͷΦϒδΣΫτ )BTI )BTI GBMTF GBMTF
JE EPOF J EPOF ૾ "SSBZ )BTI EPOFΛ USVFʹ͢Δ "SSBZ ฦΓ )BTI USVF JE EPOF
ઓུ̐ɿϑΝΠφϥΠζ "SSBZ ͱͷΦϒδΣΫτ )BTI )BTI GBMTF GBMTF
JE EPOF J EPOF ૾ "SSBZ )BTI EPOFΛ USVFʹ͢Δ "SSBZ ฦΓ )BTI USVF JE EPOF
3. Zanzouͷ࣮ͱ Zanzou͓͓Αͦɺmethod_missingͰग़དྷͯ ͍·͢ɻ͍͍ͩͨಈ͖·͕͢ɺ·ͩ͋Γ ·͢ɻ BasicObject#method_missing
Zanzouͷ࣮ • method_missingΛଟ༻ • https://docs.ruby-lang.org/ja/latest/ method/BasicObject/i/ method_missing.html • ʮଘࡏ͠ͳ͍ϝιου͕ݺΕͨʯͱ͖ͷ ॲཧΛࢦఆͰ͖Δ
αϙʔτൣғ A. JSON࡞Δͷʹ͏Α͏ͳΦϒδΣΫτα ϙʔτ͍ͨ͠ • Hash, Array, String, , true,
false, nil B. ಠࣗΫϥεઃఆΛ͢Ε͑ΔΑ͏ʹ͍ͨ͠ C. ͲͷϝιουΛݺΜͰେৎʹ͍ͨ͠
αϙʔτқ 1. , true, false, nil • immutable(ঢ়ଶΛͨͳ͍ʹมߋ͢Δ͜ͱ͕Ͱ͖ͳ͍)ͷͰ༨༟ 2. String
• mutableͰ͋Δ͚ͲɺίϯςφͰͳ͍ͷͰ؆୯ 3. Hash • ίϯςφ(ଞͷΦϒδΣΫτΛࢠཁૉͱͯͭ͠)ͳͷͰগ͠େม 4. Array • ίϯςφ͔ͭɺΠϯσοΫε͕ͣΕΔέʔε͕͋ΔͷͰ࠷ѱ
Arrayͷ • ࢠཁૉΛഁյͨ͋͠ͱɺͲ͜ʹ͍͍ͤʁ • 3൪ͷཁૉ͕ͩͬͨͣɺdeleteͰ2൪ ʹͳ͍ͬͯΔ͔ • ͦͦԿ൪͔Θ͔Βͳ͍͜ͱ (Array#sample)
Կ͕ࠔΔͷ͔ • ྫɿTODOͷྻ͕͋Δͱ͢Δ • ͋ΔTODOΛมߋ͢Δ߹ɺҎԼ͕ඞཁ • ࢠཁૉΛdup͠ɺมߋ͢Δ͜ͱ • ৽چ2ͭͷྻ͕͋Δ͜ͱ •
৽ྻͷࢠཁૉ͚ͩɺ৽͍͠ͷʹஔ͖Θ͍ͬͯΔ͜ͱ • ↑͜ͷͱ͖ʹΠϯσοΫε͕ඞཁʹͳΔ
ͪͳΈʹimmer.jsͷ߹ • ES6 Proxyͱ͍͏ͷΛ͍ͬͯΔ • ΦϒδΣΫτʹର͢Δset/getΛϑοΫͰ͖ Δ • sort()ͱ͔શͯͷset/get͕ϑοΫ͞ΕΔ(͢ ͍͝)
TPSU ͕෦తʹߦͬͨಈ࡞͕શ෦ϑοΫͰ͖ͯΔˢ ʹࢠཁૉ͕ผͷΠϯσοΫεʹҠಈͨ͜͠ͱΛݕͰ͖Δ
·ͱΊ • ES6 Proxy͍͢͝ • Rubyͷsort()CͰ࣮͞Ε͓ͯΓɺͦͷ෦ಈ࡞ϑοΫͰ͖ ͳ͍ • جຊతͳέʔεͰಈ͍͍ͯΔ •
Δέʔεpending specʹͯ͋͠ΔͷͰ୭͔ઓͯ͠΄͍͠ • 200ߦ͘Β͍ͳͷͰಡΜͰΈΔͱ໘ന͍͔ • https://github.com/yhara/zanzou