Dan Abramov: Beyond React 16 | JSConf Iceland

2018.jsconf.is/speakers/dan-a...
React 16 was released several months ago. Even though this update was largely API-compatible, the rewritten internal engine included new long-requested features and opened the door for exciting future possibilities.
In this talk, Dan will share the React team’s vision for what the future of React might look like, including some never before seen prototypes.
Whether or not you use React, Dan hopes that you will find something valuable in this talk, and that it sparks new conversations about building delightful user interfaces.

[@GfastGao]

Stunning idea & implementations in this demo. This is the second time I checkout this Talk.

[@asimgiri4269]

The demo was so special. Thank You.

[@R007h]

"jsconf iceland hello wow" xD Asking for some applause here... audience didn't seem to understand how epic this demo was :P

[@0011usagi]

Ice-cold audience. haha

[@heratpatel7174]

Very nice talk Dan

[@PhilippMeierGermany]

Great presentation with very good examples.

[@ayubmaruf3074]

Love the asynchronous part. Thanks Dan

[@WezPyke]

Fantastic talk!

[@guillaumemartinez4381]

Amazing, even 2 years after

[@ZxMYS]

This is amazing!!

[@sachindraragul1094]

Brilliant! Demo is so cool

[@tedchirvasiu]

This is so awesome

[@antonbagdatyev3699]

As I understand, in the IO demo "this.deferSetState" is needed to prevent committing the update of the "MoviePage" component until the data is ready. Basically, this way React will wait until the thrown promise is resolved and then it will apply the update after rerendering "MoviePage" with the downloaded async data.
Then, how does "this.deferSetState" play together with the "Placeholder" component added after? Can we say that without using any "Placeholder" at all, the root component of the React tree (e.g. "App") acts as an implicit "Placeholder" and waits for the async data before applying the update as the state was set through "this.deferSetState"?

[@DaniloJr]

OMG!!! Cant wait! How many lines I'll remove by using this?! Oh man

[@Patryc]

Dan is the coolest lmao

[@rakeshmanathana]

Dan's talk is never boring.

[@thanhbui1280]

this demo is amazing. its can be shared

[@tiagosa4072]

Nice talk!
Looking forward to play with it! :D
Btw, what color syntax is this? looks very good.

[@TiagoCedrim]

I also want to know what syntax color this is uahuhau. Looks great!

[@ericsproles]

looks like Night Owl

[@AmIrightbro]

All we need is access to that future folder 🔮

[@_lede]

now you do.

[@antonbagdatyev3699]

Now that React 16 has been released, how does Time Slicing work in the official React 16 release? Dan mentions that while React is rendering something asynchronously, it will not block the main JS thread allowing it to register events like scroll events without hanging. I have tried to implement the rendering of new items of a list while scrolling and there is still a slight moment where the scroll blocks because of the CPU bound work. Is that normal?

[@antonbagdatyev3699]

Is it because the slight moment where the scroll blocks is happening in the React 16's Fiber commit phase?

[@antonbagdatyev3699]

As I understood later on, React 16 does not implement Time Slicing yet, as well as the Suspense features mentioned in this talk...

[@whitetommy5559]

where to get those demo?

[@mohityadav21]

He looks like Norman Osborn from Spiderman in the thumbnail 😅

[@CarlosCruz-ig5dd]

what is that syntax theme?

[@RDY_97]

I wanna know how to impliment the clock viz.

[@kimchen1110]

Is it possible to get the source code of this demo?

[@leecoldsmoke]

There has already been some changes from the talk, and the api is still unstable, but you can now try a similar demo in the React repo. twitter.com/dan_abramov/status/1025185531515351040

[@localghost3000]

I couldn't find this createFetcher API in react doc. It's been two years since this conference. Am I missing sommething?

[@NikolasHonnef]

The "hope" in "We hope to deliver it this year". It's not out yet afaik.

[@szabikrdev5066]

React cache (www.npmjs.com/package/react-cache) will have 'createFetch' but potentially not the same name.

[@9831599481]

What is the vscode theme used here

[@lalumierehuguenote]

So now 2021, where do I find time slicing? Suspense yes. But time slicing looks cool.

[@ashwinbaskaran703]

are those features released?

[@szabikrdev5066]

@@ashwinbaskaran703 I think React Fiber (some of it still in development) is the Time Slicing and Suspense is already released, but there is still some outstanding work

[@topwaifu2104]

That fetcher/placeholder thing seems like a lot of internal magic. For me the coolest thing about react is that it is dead simple. I don't like where it's going.

[@GfastGao]

Hi Top,
I pretty agree with you, that React has a simple and good learning curve. Since I see this Talf the second time, I found that the real topic in this talk is really about something like "How powerful React can be to adapt to wide use cases." (As they said at the very beginning: different computer power and network level)

[@1421anoop]

Dan looks like Norman Osborn from Spiderman

[@user-ql4hi5hm1d]

ahahah

[@burnsnewman]

so, we're throwing away relay and other graphql libs?

[@user-ql4hi5hm1d]

wat о_О

[@richmiller2761]

Really? No ones going to comment about that dope ass turtle neck????

[@gwork5615]

AI will replace us all :)

[@georgH]

Nodejs for UI