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
Immutable, Performance and Component Communication
Search
Randy Lien
March 23, 2015
Programming
0
90
Immutable, Performance and Component Communication
React.JS TW fifth meetup
Randy Lien
March 23, 2015
Tweet
Share
More Decks by Randy Lien
See All by Randy Lien
The ideas of Clojure - Things I learn from Clojure
randylien
0
170
Django Girls 2015 - HTML
randylien
1
160
Django Girls 2015 - CSS
randylien
1
110
React.JS Conf & f8
randylien
1
200
Introduce Flux & React in KKBOX
randylien
6
420
What is the next step for a front end beginner
randylien
1
84
Understand front end developer
randylien
2
170
Introduce Flux & React in practice
randylien
8
450
UI Engineering Introduction
randylien
0
42
Other Decks in Programming
See All in Programming
2024 컴포즈 정원사
jisungbin
0
150
A New Era of Testing
mannodermaus
2
520
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
0
120
GoのIteratorに詳しくなってしまう
inatonix
1
210
エンジニア1年目で複雑なコードの改善に取り組んだ話
mtnmr
3
2k
RAGの回答精度評価用のQAデータセットを生成AIに作らせた話
kurahara
0
260
[DroidKaigi 2024] Android ViewからJetpack Composeへ 〜Jetpack Compose移行のすゝめ〜 / From Android View to Jetpack Compose: A Guide to Migration
syarihu
1
660
【TID2024】模擬講義:プログラマと一緒にゲームをデザインしてみよう!
akatsukigames_tech
0
670
Developer Joy == Developer Productivity (really!)
hollycummins
1
220
Ruby Parser progress report 2024
yui_knk
2
230
開発を加速する共有Swift Package実践
elmetal
PRO
0
420
unique パッケージから学ぶ interning と weak reference @ Asakusa.go#3
karamaru
2
810
Featured
See All Featured
VelocityConf: Rendering Performance Case Studies
addyosmani
322
23k
Web development in the modern age
philhawksworth
205
10k
GitHub's CSS Performance
jonrohan
1030
450k
Music & Morning Musume
bryan
46
6k
Keith and Marios Guide to Fast Websites
keithpitt
408
22k
Product Roadmaps are Hard
iamctodd
PRO
48
10k
Producing Creativity
orderedlist
PRO
340
39k
Statistics for Hackers
jakevdp
794
220k
Into the Great Unknown - MozCon
thekraken
29
1.4k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
230
17k
It's Worth the Effort
3n
182
27k
Fireside Chat
paigeccino
31
2.9k
Transcript
Immutable Performance Randy Lien @React.JS TW 第五次⼩小聚
About Me • @randylien • Front end developer
Agenda • Immutable • Performance • Components Communication • Conclusion
Functional Programming
None
Why Immutable? • Immutable data has no side effect! •
Shared mutable state is the root of all evil - Pete Hunt • You will not get hurt by yourself or someone
None
Why Immutable? (cont.) • Immutable.js is fast enough and memory
optimisation • Why Om is faster ? Data or Value is immutable in Clojure/ClojureScript • Immutable + PureRenderMixin
Simple Made Easy
Performance
Performance • Pure Component (prop & state) • shouldComponentUpdate •
Don’t update when its the same
Performance (cont.) • Container Component Pattern • Container Component as
Data Layer • Data fetching • Component is all about its behaviour • Testing Container or Gallery Container
Components Communication
How to Communicate • Parent - Children • Use Callbacks
• No relationship • Global event hub • Flux • Codecademy • Adapter, broadcast • Channel (CSP) • Cursor (react-cursor)
None
Conclusion
Conclusion • Embracing Immutable data for the future (JavaScript) development
• Componentize your User Interface • Loose coupling your component • Container Component • General Component • You can pick the suitable solution for your needs
None
Conclusion(cont.) • Watch Simple made easy • Try Clojure/ClojureScript
FAQ