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
Streams APIとTCPフロー制御 / Web Streams API and TCP flow control
tasshi
1
300
GCCのプラグインを作る / I Made a GCC Plugin
shouth
1
150
Honoの来た道とこれから
yusukebe
19
3k
Pinia Colada が実現するスマートな非同期処理
naokihaba
2
160
のびしろを広げる巻き込まれ力:偶然を活かすキャリアの作り方/oso2024
takahashiikki
1
410
Nuxtベースの「WXT」でChrome拡張を作成する | Vue Fes 2024 ランチセッション
moshi1121
1
530
C#/.NETのこれまでのふりかえり
tomokusaba
1
160
開発効率向上のためのリファクタリングの一歩目の選択肢 ~コード分割~ / JJUG CCC 2024 Fall
ryounasso
0
370
CSC509 Lecture 09
javiergs
PRO
0
110
色々なIaCツールを実際に触って比較してみる
iriikeita
0
270
WEBエンジニア向けAI活用入門
sutetotanuki
0
300
Hotwire or React? ~Reactの録画機能をHotwireに置き換えて得られた知見~ / hotwire_or_react
harunatsujita
9
4.1k
Featured
See All Featured
Writing Fast Ruby
sferik
626
61k
Raft: Consensus for Rubyists
vanstee
136
6.6k
A Tale of Four Properties
chriscoyier
156
23k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
9
680
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
167
49k
4 Signs Your Business is Dying
shpigford
180
21k
Designing for Performance
lara
604
68k
Java REST API Framework Comparison - PWX 2021
mraible
PRO
28
7.9k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
159
15k
Ruby is Unlike a Banana
tanoku
96
11k
Designing Experiences People Love
moore
138
23k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
43
6.6k
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