Deferring Data + Streaming in Remix
HTML-код
- Опубликовано: 11 июл 2024
- Learn how to reduce your website's load time by deferring and streaming data using defer, Suspense, and Await.
Play with this demo 👉 remix-movies.pages.dev/
Checkout the code 👉 github.com/remix-run/example-...
00:00 - Project overview
00:45 - Previewing the deployed site
01:45 - Real-world profiling with WebPageTest
02:46 - What are we waiting on?
03:55 - Using defer to improve the page speed
07:32 - Previewing the site with deferred data
10:21 - Deferred explained
12:06 - Real-world profiling with deferred data
Learn more at remix.run Наука
i do owe this framework an apology
You're forgiven
😁@@Remix-Run
These videos are so good. Ryan is such a great teacher.
Very cool demo. Its explanation is so clear
This is really cool! Thanks for posting.
This API is so brilliant. I love it.
Amazing as usually!
I know it's an escape hatch, but loader context is great ❤
Special thanks for doing the explainer videos in just javascript and not TS. Less overhead!
very cool, and then they said, server rendering should have all the data streamed in the html already :)
i wish at my work there were using remix lmao.
How can we reproduce the defer ? it is any way to do it ?
I love the videos, thanks for that. great format, short and really friendly
Nice video Ryan 👍 Can you get thesame effect with an external backend service??
yes, i am using tmdb api with defer
You can defer any promise. As long as that service is called through a promise (like a fetch request) defer it
Can you do a video on integrating remix with an external backend api with features like authentication?
Look at the Remix Stacks. Several of them have authentication with various database services.
How did you get these breadcrumbs and move the close window row into the top top bar?
thanks to makes me trust on react again
Cloudflare, nice!
hi ryan, I'm learning remix and a doubt came up, since I've seen that in several demos you disable javascript, do you think it should be a goal that any page should work without js? I've seen myself trying to get the same functionality in both scenarios but I'm not sure if it makes sense, I would like to know what you think. thanks!
Yes and no. Barely any user disables JavaScript today; however, optimizing for "before JS loads" makes totally sense. E.g. imagine you're on a train and the internet is suuper slow - should the slow JS block you from submitting a form, clicking a link, ...? Probably not. So making sure things work before JS loads enhances user experience for users with slow internet and/or slow devices.
how do i add the type saftey like why don't i am getting suggestion for the env ? in the context and to the particular schema?
Defer still good for SEO ?
I was try it and what in pagesource it seem that show loading... component
@Remix any idea why the ui is blocked until the deffered promise is resolved ?
What code editor is it?
VS Code, but not sure about the config
wish i could use remix in react native/expo
Is "defer" only available for Cloudfare?
Nope! Your host just needs to provide streaming. From the docs
"Ensure your hosting provider supports streaming, not all of them do. If your responses don't seem to stream, this might be the cause."
Can you address the time out issue we are getting with defer in your github issues? We can't use this feature because of it @Remix-Run
remix being bought be a tier 2 tech company like shopify has made it lose a lot of steam. should have stayed independent.
what an insane take lmao