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
91
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
430
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
Click-free releases & the making of a CLI app
oheyadam
2
120
ローコードSaaSのUXを向上させるためのTypeScript
taro28
1
630
Make Impossible States Impossibleを 意識してReactのPropsを設計しよう
ikumatadokoro
0
240
TypeScriptでライブラリとの依存を限定的にする方法
tutinoko
3
700
as(型アサーション)を書く前にできること
marokanatani
10
2.7k
3 Effective Rules for Using Signals in Angular
manfredsteyer
PRO
1
100
OnlineTestConf: Test Automation Friend or Foe
maaretp
0
120
聞き手から登壇者へ: RubyKaigi2024 LTでの初挑戦が 教えてくれた、可能性の星
mikik0
1
130
距離関数を極める! / SESSIONS 2024
gam0022
0
290
Webの技術スタックで マルチプラットフォームアプリ開発を可能にするElixirDesktopの紹介
thehaigo
2
1k
Kaigi on Rails 2024 〜運営の裏側〜
krpk1900
1
240
最新TCAキャッチアップ
0si43
0
200
Featured
See All Featured
Producing Creativity
orderedlist
PRO
341
39k
4 Signs Your Business is Dying
shpigford
180
21k
Building a Modern Day E-commerce SEO Strategy
aleyda
38
6.9k
Music & Morning Musume
bryan
46
6.2k
Designing Experiences People Love
moore
138
23k
A better future with KSS
kneath
238
17k
Optimizing for Happiness
mojombo
376
70k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
48k
Building an army of robots
kneath
302
43k
A Philosophy of Restraint
colly
203
16k
What's in a price? How to price your products and services
michaelherold
243
12k
The Invisible Side of Design
smashingmag
298
50k
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