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: What Lies Ahead
Search
spicyj
February 22, 2016
Technology
6
340
React: What Lies Ahead
React.js Conf 2016
spicyj
February 22, 2016
Tweet
Share
More Decks by spicyj
See All by spicyj
Creating interactive learning interfaces at Khan Academy
spicyj
0
110
Understanding state in React
spicyj
1
97
ndb
spicyj
0
120
css
spicyj
2
800
Other Decks in Technology
See All in Technology
第13回 Data-Centric AI勉強会, 画像認識におけるData-centric AI
ksaito_osx
0
360
MC906491 を見据えた Microsoft Entra Connect アップグレード対応
tamaiyutaro
1
480
5分で紹介する生成AIエージェントとAmazon Bedrock Agents / 5-minutes introduction to generative AI agents and Amazon Bedrock Agents
hideakiaoyagi
0
220
自動テストの世界に、この5年間で起きたこと
autifyhq
10
7.1k
PL900試験から学ぶ Power Platform 基礎知識講座
kumikeyy
0
110
High Performance PHP
cmuench
0
140
【Developers Summit 2025】プロダクトエンジニアから学ぶ、 ユーザーにより高い価値を届ける技術
niwatakeru
2
890
事業継続を支える自動テストの考え方
tsuemura
0
300
プロセス改善による品質向上事例
tomasagi
1
1.6k
WAF に頼りすぎない AWS WAF 運用術 meguro sec #1
izzii
0
460
データ基盤の成長を加速させる:アイスタイルにおける挑戦と教訓
tsuda7
3
650
Platform Engineeringは自由のめまい
nwiizo
4
1.9k
Featured
See All Featured
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
45
2.3k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
27
1.9k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
47
5.2k
Gamification - CAS2011
davidbonilla
80
5.1k
Designing on Purpose - Digital PM Summit 2013
jponch
117
7.1k
Building a Scalable Design System with Sketch
lauravandoore
460
33k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
33
2.8k
How GitHub (no longer) Works
holman
313
140k
Into the Great Unknown - MozCon
thekraken
35
1.6k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
33
2.1k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
129
19k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
44
7k
Transcript
React: What Lies Ahead Ben Alpert
How can React help make great apps? UX and DX.
UX: User Experience
1. Animations Helpful for spatial reasoning <Animated.View --style={{width:-this.state.width}}-/>- this.state-=-{width:-new-Animated.Value(0.0)}; Animated
--.spring(this.state.width,-{toValue:-120.0}) --.start();
2. Gestures Maps: pan, pinch, tap, double tap, press and
hold Can’t build this with browser events Goal: Simple component API, pure JS
3. Performance: Making lists fast Windowing: Only render what’s on
screen Render in chunks: Break up rendering to avoid jank Layout: Avoid unnecessary reflows
What if layout was done in React? Layout information available
in render() Avoids unnecessary reflows Makes windowing simpler Skip creation of layout-only views Easily build new layout primitives
DX: Developer Experience
Focusing on developer experience means devs can build apps faster
and leads to higher-quality apps.
1. New project experience Need to set up node, npm,
gulp, webpack, babel $-vim-app.js $-react-run-GGplatform=web-app.js- Goal: Quickly prototype with one file, then grow app slowly over time
2. Devtools Inspector for Chrome/Firefox (react-devtools)
2. Devtools Inspector for Chrome/Firefox (react-devtools) Hot loading (react-transform-hmr) IDE
support (nuclide, deco) More like this, please!
3. Data management React setState Flux/Redux Relay Goal: Combine best
of three, with easy setup and code reuse
None
None
Getting There
React today 0.14 now, prod-ready and stable since 2013 React
15.0 RC next week DOM: Full SVG support, no <span> text wrappers Internal refactors: No more React IDs, 10% faster
React is a growing community 300 react, 600 react-native committers
in 2015 36,000 GitHub stars 225,000 Chrome users with react-devtools installed Projects: redux, material-ui, react-router, enzyme
Help us keep building tools for making great apps. Thanks.