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
それは残像だ
Search
yhara
June 29, 2019
Programming
4
4.5k
それは残像だ
http://regional-gh.rubykaigi.org/tochigi08/
yhara
June 29, 2019
Tweet
Share
More Decks by yhara
See All by yhara
静的型付けプログラミング言語Shiika
yhara
0
20k
スモートーク
yhara
0
3k
Ovto: Frontend web framework for Rubyists
yhara
0
7.6k
Ruby, Opal and WebAssembly
yhara
2
2.7k
Competitive Programming in Ruby (101)
yhara
0
760
Rubyで競技プログラミング(入門編)
yhara
0
1.9k
良いデバッグログはプロジェクトの資産である
yhara
54
18k
Let's make a functional language!
yhara
0
6.4k
Recent Updates (近況報告)
yhara
0
650
Other Decks in Programming
See All in Programming
NixOS + Kubernetesで構築する自宅サーバーのすべて
ichi_h3
0
1.1k
バッチ処理を「状態の記録」から「事実の記録」へ
panda728
PRO
0
180
なぜGoのジェネリクスはこの形なのか? - Featherweight Goが明かす設計の核心
qualiarts
0
230
登壇は dynamic! な営みである / speech is dynamic
da1chi
0
350
モテるデスク環境
mozumasu
3
760
Leading Effective Engineering Teams in the AI Era
addyosmani
7
560
Domain-centric? Why Hexagonal, Onion, and Clean Architecture Are Answers to the Wrong Question
olivergierke
3
940
Devvox Belgium - Agentic AI Patterns
kdubois
1
130
The Past, Present, and Future of Enterprise Java
ivargrimstad
0
380
実践Claude Code:20の失敗から学ぶAIペアプログラミング
takedatakashi
16
6.5k
CSC305 Lecture 06
javiergs
PRO
0
270
SwiftDataを使って10万件のデータを読み書きする
akidon0000
0
230
Featured
See All Featured
Why Our Code Smells
bkeepers
PRO
340
57k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
657
61k
Six Lessons from altMBA
skipperchong
29
4k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
A designer walks into a library…
pauljervisheath
209
24k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
How STYLIGHT went responsive
nonsquared
100
5.8k
How to Ace a Technical Interview
jacobian
280
24k
Product Roadmaps are Hard
iamctodd
PRO
55
11k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
115
20k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
190
55k
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