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
React Performance: ONE WEIRD TRICK
Search
Jamison Dance
April 29, 2016
Programming
1
190
React Performance: ONE WEIRD TRICK
How do you optimize React applications? WITH ONE WEIRD TRICK
Jamison Dance
April 29, 2016
Tweet
Share
More Decks by Jamison Dance
See All by Jamison Dance
Community for New Developers
jergason
0
60
Pop Culture, The Pendulum and Progress
jergason
0
99
Rethinking All Practices: Building Web Applications with Elm
jergason
2
190
The Future is Old - Functional Programming in JavaScript
jergason
1
250
Notes From The Future: Beyond Flux
jergason
0
110
nosql and mongodb: ¯\_(ツ)_/¯
jergason
0
150
Other Decks in Programming
See All in Programming
そのpreloadは必要?見過ごされたpreloadが技術的負債として爆発した日
mugitti9
2
3.4k
技術的負債の正体を知って向き合う / Facing Technical Debt
irof
0
180
オープンソースソフトウェアへの解像度🔬
utam0k
16
3k
(Extension DC 2025) Actor境界を越える技術
teamhimeh
1
260
Devoxx BE - Local Development in the AI Era
kdubois
0
130
What Spring Developers Should Know About Jakarta EE
ivargrimstad
0
160
Building, Deploying, and Monitoring Ruby Web Applications with Falcon (Kaigi on Rails 2025)
ioquatix
4
2.2k
bootcamp2025_バックエンド研修_WebAPIサーバ作成.pdf
geniee_inc
0
110
コードとあなたと私の距離 / The Distance Between Code, You, and I
hiro_y
0
170
XP, Testing and ninja testing ZOZ5
m_seki
3
690
「ちょっと古いから」って避けてた技術書、今だからこそ読もう
mottyzzz
11
6.8k
CSC305 Lecture 04
javiergs
PRO
0
270
Featured
See All Featured
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
140
34k
Typedesign – Prime Four
hannesfritz
42
2.8k
The Cult of Friendly URLs
andyhume
79
6.6k
Building Applications with DynamoDB
mza
96
6.7k
The Power of CSS Pseudo Elements
geoffreycrofte
79
6k
Building Adaptive Systems
keathley
44
2.8k
Imperfection Machines: The Place of Print at Facebook
scottboms
269
13k
GitHub's CSS Performance
jonrohan
1032
470k
Intergalactic Javascript Robots from Outer Space
tanoku
273
27k
Leading Effective Engineering Teams in the AI Era
addyosmani
6
440
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
30
2.9k
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.4k
Transcript
React Performance @jergason
BUY React Rally Tickets http://reactrally.com
React Performance
ONE WEIRD TRICK for speeding up your React applications
ONE WEIRD TRICK
ONE WEIRD TRICK Have a deep knowledge of React's rendering
model and JavaScript execution combined with familiarity with browser and React performance tooling.
ONE WEIRD TRICK Have a deep knowledge of React's rendering
model and JavaScript execution combined with familiarity with browser and React performance tooling and know some basic techniques of general optimization.
How React Works How Optimization Works Demo
How React Works
setState render render render
dispatch reducer render render render render render render
How Optimization Works
Rules of Optimization 1.Don't 2.Don't yet 3.Profile before optimizing http://c2.com/cgi/wiki?RulesOfOptimization
Optimization In React
Render will be called MANY TIMES
Two Options • call render fewer times • make render
faster
Demo https://github.com/jergason/slowloris
Resources • https://facebook.github.io/react/docs/perf.html • https://facebook.github.io/react/docs/advanced- performance.html • http://benchling.engineering/performance- engineering-with-react/ •
http://benchling.engineering/deep-dive-react-perf- debugging/ • https://github.com/reddit/reddit-mobile/issues/247