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.4k
それは残像だ
http://regional-gh.rubykaigi.org/tochigi08/
yhara
June 29, 2019
Tweet
Share
More Decks by yhara
See All by yhara
静的型付けプログラミング言語Shiika
yhara
0
19k
スモートーク
yhara
0
2.9k
Ovto: Frontend web framework for Rubyists
yhara
0
7.5k
Ruby, Opal and WebAssembly
yhara
2
2.6k
Competitive Programming in Ruby (101)
yhara
0
740
Rubyで競技プログラミング(入門編)
yhara
0
1.9k
良いデバッグログはプロジェクトの資産である
yhara
54
18k
Let's make a functional language!
yhara
0
6.4k
Recent Updates (近況報告)
yhara
0
630
Other Decks in Programming
See All in Programming
Railsアプリケーションと パフォーマンスチューニング ー 秒間5万リクエストの モバイルオーダーシステムを支える事例 ー Rubyセミナー 大阪
falcon8823
4
1k
地方に住むエンジニアの残酷な現実とキャリア論
ichimichi
5
1.4k
なぜ適用するか、移行して理解するClean Architecture 〜構造を超えて設計を継承する〜 / Why Apply, Migrate and Understand Clean Architecture - Inherit Design Beyond Structure
seike460
PRO
1
710
Select API from Kotlin Coroutine
jmatsu
1
190
コードの90%をAIが書く世界で何が待っているのか / What awaits us in a world where 90% of the code is written by AI
rkaga
48
32k
NPOでのDevinの活用
codeforeveryone
0
470
Composerが「依存解決」のためにどんな工夫をしているか #phpcon
o0h
PRO
1
240
Rubyでやりたい駆動開発 / Ruby driven development
chobishiba
1
510
PostgreSQLのRow Level SecurityをPHPのORMで扱う Eloquent vs Doctrine #phpcon #track2
77web
2
410
Result型で“失敗”を型にするPHPコードの書き方
kajitack
4
540
システム成長を止めない!本番無停止テーブル移行の全貌
sakawe_ee
1
150
Hypervel - A Coroutine Framework for Laravel Artisans
albertcht
1
110
Featured
See All Featured
Imperfection Machines: The Place of Print at Facebook
scottboms
267
13k
Unsuck your backbone
ammeep
671
58k
Building Applications with DynamoDB
mza
95
6.5k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
229
22k
Designing for humans not robots
tammielis
253
25k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
20
1.3k
Building a Scalable Design System with Sketch
lauravandoore
462
33k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
124
52k
Build The Right Thing And Hit Your Dates
maggiecrowley
36
2.8k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
30
2.1k
Why Our Code Smells
bkeepers
PRO
337
57k
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