Upgrade to Pro — share decks privately, control downloads, hide ads and more …

10 things you need to know about React 16

Avatar for r31gN_ r31gN_
March 17, 2018
Technology
410
0

10 things you need to know about React 16

Avatar for r31gN_

r31gN_

March 17, 2018

More Decks by r31gN_

See All by r31gN_
State management in React using Context and Hooks APIs
Avatar for r31gN_ r31gn
0
250
React internals (fibers, coroutines, algebraic effects)
Avatar for r31gN_ r31gn
1
560
Breaking React apart Fiber by Fiber
Avatar for r31gN_ r31gn
0
270
Progressive Web Apps - The Future
Avatar for r31gN_ r31gn
2
320
The Magic Behind HTTP/2
Avatar for r31gN_ r31gn
0
170
Client Side Reactive Programming Using RxJS
Avatar for r31gN_ r31gn
0
190
CSS Architecture
Avatar for r31gN_ r31gn
1
130
Embrace Native JavaScript
Avatar for r31gN_ r31gn
0
100
From Callback Hell To Promises Heaven
Avatar for r31gN_ r31gn
1
180

Other Decks in Technology

See All in Technology
データモデリング通り #5オンライン勉強会： AIに『ビジネスの文脈』を教え込むデータモデリング
Avatar for データ横丁 datayokocho
0
180
多角的な視点から見たAGI
Avatar for Terisuke terisuke
0
120
Building a Study Buddy AI Agent from Scratch: From Passive Chatbots to Autonomous Systems
Avatar for Patrick Eichler itchimonji
0
140
拝啓、あの夏の僕へ〜あなたも知っているApp Runnerの世界〜
Avatar for 荒木 ARK news_it_enj
0
220
Agents CLI と Gemini Enterprise Agent Platform で マルチエージェント開発が楽しくなる！
Avatar for Kaz kaz1437
0
260
AI時代に、 データアナリストがデータエンジニアに異動して
Avatar for jackojacko_ jackojacko_
0
220
世界の中心でApp Runnerを叫ぶ FINAL
Avatar for つくぼし tsukuboshi
0
250
エージェント時代の UIとAPI、CLI戦略
Avatar for coincheck coincheck_recruit
0
150
[Scram Fest Niigata2026]Quality as Code〜AIにQAの思考を再現させる試み〜
Avatar for Masami Yajiri masamiyajiri
1
270
新卒エンジニア研修、ハンズオンの設計における課題と実践知/ #tachikawaany
Avatar for Ichiro Nishiuma nishiuma
2
130
The 7 pitfalls of AI
Avatar for Uwe Friedrichsen ufried
0
200
Shiny New Tools Won't Fix Your Problem
Avatar for Trisha Gee trishagee
1
110

Featured

See All Featured
Build The Right Thing And Hit Your Dates
Avatar for Maggie C. maggiecrowley
39
3.1k
The Director’s Chair: Orchestrating AI for Truly Effective Learning
Avatar for Mike Taylor tmiket
1
160
How to Build an AI Search Optimization Roadmap - Criteria and Steps to Take #SEOIRL
Avatar for Aleyda Solis aleyda
1
2k
BBQ
Avatar for Matthew Crist matthewcrist
89
10k
The agentic SEO stack - context over prompts
Avatar for schlessera schlessera
0
770
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
Avatar for Marc Duiker marcduiker
35
2.4k
Stop Working from a Prison Cell
Avatar for Chris Michel hatefulcrawdad
274
21k
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
Avatar for Aleyda Solis aleyda
1
2k
The Spectacular Lies of Maps
Avatar for Per Axbom axbom
PRO
1
730
What Being in a Rock Band Can Teach Us About Real World SEO
Avatar for Ade Holder 427marketing
0
220
A brief & incomplete history of 
UX Design for the World Wide Web: 1989–2019
Avatar for Jason CranfordTeague jct
1
370
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
Avatar for Stéphanie Walter stephaniewalter
287
14k

Transcript

  1. KRAK3N 10 things you need to know About react 16

  2. KRAK3N @r31gN_ Consultant / GDE krak3n

  3. KRAK3N • Fiber (16.0) • Multiple returns from render (16.0)

    • Streaming mode for server side rendering (16.0) • Error boundaries (16.0) • Portals (16.0) • Fragments (16.2) • Context (16.3) • Lifecycle methods changes (16.3) • StrictMode (16.3) • React.unstable_AsyncMode (16.3)

  4. KRAK3N Fiber

  5. KRAK3N OLD RECONCILER RENDERING

  6. KRAK3N FIBER RENDERING

  7. KRAK3N Multiple returns From render

  8. KRAK3N Streaming mode for ssr

  9. KRAK3N

  10. KRAK3N

  11. KRAK3N ERROR BOUNDARIES

  12. KRAK3N REACT PORTALS

  13. KRAK3N REACT FRAGMENTS

  14. KRAK3N NEW CONTEXT API

  15. KRAK3N LIFECYCLE METHODs CHANGES

  16. KRAK3N componentwillmount Componentwillupdate Componentwillreceiveprops

  17. KRAK3N componentwillmount Componentwillupdate Componentwillreceiveprops Componentdidmount

  18. KRAK3N componentwillmount Componentwillupdate Componentwillreceiveprops Componentdidmount Componentdidupdate

  19. KRAK3N componentwillmount Componentwillupdate Componentwillreceiveprops Componentdidmount Componentdidupdate getDerivedStateFromProps

  20. KRAK3N REACT STRICTMODE

  21. KRAK3N REACT ASYNCMODE

  22. KRAK3N Resources • https://medium.com/@baphemot/whats-new-in- react-16-3-d2c9b7b6193b • https://codesandbox.io/u/r31gN/sandboxes • https://github.com/koba04/react-fiber-resources •

    https://www.youtube.com/watch?v=v6iR3Zk4oDY

  23. KRAK3N – Reign “ keep on smiling because you are

    the most Beautiful people when you do. ”

  24. KRAK3N Thank you! @r31gN_