Live data from Hacker News

Beyond React 16 by Dan Ambramov – Async Rendering and React Suspense

youtube.com

1–10 of 66 posts

Re: Beyond React 16 by Dan Ambramov – Async Rendering and React Suspense

#2
typo in the title - its Abramov not Ambramov

It's interesting that Lin Clark basically demoed Time Slicing a -year- ago at ReactConf: https://www.youtube.com/watch?v=ZCuYPiUIONs and in the first 10 mins of Dan's talk you see basically the same thing with user interaction applied.

createFetcher is brand new and here's the metaconversation on Twitter/Github: https://twitter.com/acdlite/status/969168681644179456 and https://github.com/facebook/react/pull/12279/files#diff-50d8...

with a couple implementations here (https://twitter.com/jamiebuilds/status/969169357094842368) and here (https://twitter.com/actualhypercrab/status/94131894239559680...)

// style discussion below

one thing I really appreciate about this talk is hard it is to even communicate asynchronous problems and the solutions to them. Personally the lagging animationFrame clock display (for time slicing) and the loading state devtools (for "react suspense") were actually the bigger "wow" moments. (Yes I know this talk is not about the tools or the charts)

he does another thing I'm a fan of - starting with a question. this helps frame the rest of the talk: explaining why the question is a big deal, breaking the question down, proposing some solutions, showing how the solutions answer the question.

bottom line - there's more to learn from this talk than just React.

Re: Beyond React 16 by Dan Ambramov – Async Rendering and React Suspense

#3
So glad someone captured this talk!

At the 15 minute mark, he introduces a new paradigm for asynchronous IO within render functions; see a screenshot here: https://www.dropbox.com/s/wybqgtftuyqipk8/Screenshot%202018-.... This is groundbreaking, to say the least, as previously this needed to be done by adding higher-order components to inject the result of the fetch as a prop at some higher level; now, it's as simple as changing the src property in a single line of code.

One of Dan's colleagues, Andrew Clark, described how this is implemented on Twitter: https://twitter.com/acdlite/status/969171217356746752

    Here's how suspending works:
    - in the render method, read a value from the cache.
    - if the value is already cached, the render continues like normal
    - if the value is not already cached, the cache *throws a promise*
    - when the promise resolves, React retries where it left off
Digging into the source code released in this companion tweet, imageFetcher.read() indeed throws (instead of an exception) a Promise that is apparently caught by React's new error handling infrastructure and handled somewhere up the chain. https://github.com/facebook/react/blob/master/packages/simpl...

The talk indicated that there will be tons of support for granularly choosing when/how to show spinners, allowing interactivity with the rest of the interface, etc. while this loading is ongoing.

It's a bit magical, but promising to say the least!

Re: Beyond React 16 by Dan Ambramov – Async Rendering and React Suspense

#4
post #2

typo in the title - its Abramov not Ambramov It's interesting that Lin Clark basically demoed Time Slicing a -year- ago at ReactConf: https://www.youtube.com/watch?v=ZCuYPiUIONs and in the first 10 mins of Dan's talk you see basically the same thing with user interaction applied. createFetcher is brand new and here's the metaconversation on Twitter/Github: https://twitter.com/acdlite/status/969168681644179456 and htt…

Yep, nice link roundup - beat me to it :)

Also see the summary post on the React blog for the key takeaways from the demo:

https://reactjs.org/blog/2018/03/01/sneak-peek-beyond-react-...

Re: Beyond React 16 by Dan Ambramov – Async Rendering and React Suspense

#6
I express how excited I am for async rendering.

In my experience React has had 2 major paint points. async anything, and styling. And this fixes the former, and I'd argue that the latter isn't necessarily their job to fix.

Also, to have done this in a way that keeps a LOT of backwards compatibility is amazing.

Re: Beyond React 16 by Dan Ambramov – Async Rendering and React Suspense

#7
post #5

Is there plan to implement the react-core in C or other native language ? I can see that being compiled to webassembly for browsers and react-native can have multiple language support ?

No, there's no plans to rewrite the React core in C, Rust, Reason, WASM, or anything else right now.

Lin Clark, who works for Mozilla, gave a talk on "What WebAssembly Means for React" last year ( https://www.youtube.com/watch?v=3GHJ4cbxsVQ ). In a recent Twitter thread, she said that some more useful WASM pieces are in the works, but still not likely to be a big improvement or worth the effort to rewrite React ( https://twitter.com/linclark/status/967860936550879232 ).

Re: Beyond React 16 by Dan Ambramov – Async Rendering and React Suspense

#8
post #7
post #5

Is there plan to implement the react-core in C or other native language ? I can see that being compiled to webassembly for browsers and react-native can have multiple language support ?

No, there's no plans to rewrite the React core in C, Rust, Reason, WASM, or anything else right now. Lin Clark, who works for Mozilla, gave a talk on "What WebAssembly Means for React" last year ( https://www.youtube.com/watch?v=3GHJ4cbxsVQ ). In a recent Twitter thread, she said that some more useful WASM pieces are in the works, but still not likely to be a big improvement or worth the effort to rewrite React ( htt…

Maybe Reason one day?

Then it could compile directly to native.

Re: Beyond React 16 by Dan Ambramov – Async Rendering and React Suspense

#9
post #4
post #2

typo in the title - its Abramov not Ambramov It's interesting that Lin Clark basically demoed Time Slicing a -year- ago at ReactConf: https://www.youtube.com/watch?v=ZCuYPiUIONs and in the first 10 mins of Dan's talk you see basically the same thing with user interaction applied. createFetcher is brand new and here's the metaconversation on Twitter/Github: https://twitter.com/acdlite/status/969168681644179456 and htt…

Yep, nice link roundup - beat me to it :) Also see the summary post on the React blog for the key takeaways from the demo: https://reactjs.org/blog/2018/03/01/sneak-peek-beyond-react-...

Thanks for the link.

But boy, the Apple presentation style is so heavy in that blog post. "We call this...", "We can't wait..."

Re: Beyond React 16 by Dan Ambramov – Async Rendering and React Suspense

#10
post #3

So glad someone captured this talk! At the 15 minute mark, he introduces a new paradigm for asynchronous IO within render functions; see a screenshot here: https://www.dropbox.com/s/wybqgtftuyqipk8/Screenshot%202018-... . This is groundbreaking, to say the least, as previously this needed to be done by adding higher-order components to inject the result of the fetch as a prop at some higher level; now, it's as simple…

So I am guessing if a prop is `instanceof Promise` or some other constructor then it must trigger this response . . . is that correct?
Post reply on HN