Link
Embed
Share
Beginning
This slide
Copy link URL
Copy link URL
Copy iframe embed code
Copy iframe embed code
Copy javascript embed code
Copy javascript embed code
Share
Tweet
Share
Tweet
Slide 1
Slide 1 text
What’s new with React 2018 Edition
Slide 2
Slide 2 text
What’s new with React Spring 2018 Edition
Slide 3
Slide 3 text
What’s new with React April 2018 Edition
Slide 4
Slide 4 text
What’s new with React 4 April 2018 2:51PM Edition
Slide 5
Slide 5 text
What’s new with React
Slide 6
Slide 6 text
What’s React?
Slide 7
Slide 7 text
“Will I still need jQuery?”
Slide 8
Slide 8 text
No content
Slide 9
Slide 9 text
No content
Slide 10
Slide 10 text
No content
Slide 11
Slide 11 text
React 16
Slide 12
Slide 12 text
No content
Slide 13
Slide 13 text
Portals
Slide 14
Slide 14 text
Fragments >
Slide 15
Slide 15 text
Error Boundaries
Slide 16
Slide 16 text
React 16.3
Slide 17
Slide 17 text
React 16.3 componentWillMount
Slide 18
Slide 18 text
React 16.3 componentWillUpdate
Slide 19
Slide 19 text
React 16.3 componentWillReceiveProps
Slide 20
Slide 20 text
React 16.3 UNSAFE_componentWillMount hello! (etc)
Slide 21
Slide 21 text
React 16.3 getDerivedStateFromProps hello!
Slide 22
Slide 22 text
React 16.3 New Context API
Slide 23
Slide 23 text
<>
Dashboard
Submi >
Slide 24
Slide 24 text
<>
Slide 25
Slide 25 text
<> Dashboard >
Slide 26
Slide 26 text
<>
Slide 27
Slide 27 text
<>
Dashboard
Submi >
Slide 28
Slide 28 text
<>
Slide 29
Slide 29 text
window.store =
Slide 30
Slide 30 text
https://codesandbox.io/s/0014vr1xnl https://www.youtube.com/watch?v=XLJN4JfniH4
Slide 31
Slide 31 text
React 16.??? Async Rendering
Slide 32
Slide 32 text
React 16.??? Async Rendering A.K.A. the reason Fiber exists
Slide 33
Slide 33 text
No content
Slide 34
Slide 34 text
React 16 Fiber 1. Reconciliation 2. Commit
Slide 35
Slide 35 text
React 16 Fiber https://claudiopro.github.io/react-fiber-vs-stack-demo
Slide 36
Slide 36 text
React 16 Fiber How do you know which updates are high priority and which are low priority?
Slide 37
Slide 37 text
React 16 Fiber T I M E S L I C I N G
Slide 38
Slide 38 text
React 16 Fiber S U S P E N S E
Slide 39
Slide 39 text
React 16 Fiber
Slide 40
Slide 40 text
React 16.??? Async Rendering T I M E S L I C I N G + S U S P E N S E
Slide 41
Slide 41 text
So what?