Your videos are so calm, well explained and cover important topics. One of my favorite React related channels 😍

I have never used suspense before... I am sold and will now be checking out your other two videos!

I like your thought process Sam. I’d pay for a course if you decide to make one

@samselikoff

2 жыл бұрын

That means a lot - thank you so much!!

@jimshtepa5423

2 жыл бұрын

I would pay too. I really liked the tw course on egghead

I'm just binge watching all of your videos. You explain concepts really really well! Thanks!

Awesome demo. The DX is really so much more improved with this architecture. I'm excited to see this make its way into more libraries when Suspense is finalized

As always, an amazing material, Sam! You nailed the question I (and other folks) had from your previous video. Please keep up with more content! Cheers

Simple demo but executed beautifully.

Simple , clear and easy to follow along

Great example, and very clearly explained. Thank you!!

So clean explanation and calm presentation. Loved it :)

This was excellently delivered.

Thanks for making your videos short but very helpful

Thank you!! I didn't know SWR.

Well thought out presentation to the subject based on made-up business requirements.

Thank you for this video, really helpful!

I use this to catch a chunk 404 when I have pushed a new commit. I reload the page when that happens. So far that works great 😉

really good explanation, thank you

It's interesting to note that the SWR docs have a warning at the topic saying "React still doesn't recommend using Suspense in data frameworks like SWR (More information)"

@samselikoff

Жыл бұрын

I guess SWR may not be getting as much attention since RSC replaces a lot of the use case for it. Still useful though and there will still be use cases for client side data fetching, and suspense is definitely ready to go!

you just got yourself a new subscriber and lurker

Good explanation, thank you much

Awesome video, thanks

thank u for this great quality content

Thank you

Thanks

Thanks for your helpful video. Just wondering is Suspense and Error Boundaries works if I originally fetch my data using anonymous async function in useEffect with axios in the component? Since I saw you are using useSWR. Thanks again.

Another great video, one question, how would you trigger a refetch from your error state? The fetch happens in the child but we have caught the error in the parent. How to add a retry button. Thanks again for the stellar content

Hi! Thanks for your quality content. When error happens, is there any way to add a try again button that will try to call api again?

Nice Video and thanks for sharing. It seems the tradeoff here is a bit of performance (Creating Network waterfall) since the app needs to wait for the whole content to load.

From a user's standpoint, one loading spinner is much less stress inducing than three

Hey, love your videos, can you show more about how we can optimze coding speed? I see you grab all your stats with vs code, maybe you can create a small video about that if you have time.

@samselikoff

2 жыл бұрын

I should make a React focused video but for now check this one out! kzread.info/dash/bejne/o318tJSwndvfY7g.html

What is this VS Code shortcuts sorcery?? Good explanation. I like your style.

Hey Sam, I'm guessing you're using vim motions in your editor. What is the shortcut you're using to select next occurrence of tag @1:27? Like when you highlight the line using visualLineMode, and then highlight the next matching lines and then go ahead to edit them. What is the key combo for doing that?

@user-pr4ez7hn6u

Жыл бұрын

Ctrl + D for every next occurrence you are willing to select -> Ctrl + Shift + L to match all occurrences at once

@tech3425

Жыл бұрын

@@user-pr4ez7hn6u Is that specific to VSCode? Cause Vim has a mapping of PageDown to Control+D

@tech3425

Жыл бұрын

@@user-pr4ez7hn6u Although, Cntrl+Shift+L is working as you said 👍

what editor do you use? i use neovim and am not sure how i would do the multiline edit as you are doing.

@samselikoff

2 жыл бұрын

I use VS Code with the Vim extension

1:27 Any chance you could do a really quick screenshare of how you're doing that multiple cursor suspense tag nesting thing? I might be the last developer in the world to adopt multiple cursor editing!

@samselikoff

2 жыл бұрын

Check out this timestamp from my Shortcuts + Extensions video! kzread.info/dash/bejne/o318tJSwndvfY7g.html

@tshddx

2 жыл бұрын

@@samselikoff Perfect, thanks!

Mind if I ask what's your VS setup like and shortcuts?

Hi Sam. I've been searching for how to do this code formatting trick at you pulled off at 1:26 . Can you please tell me how you it's done?

@samselikoff

2 жыл бұрын

+D on Apple in VSCode, it's called "Multiple selections" code.visualstudio.com/docs/editor/codebasics#_multiple-selections-multicursor

@augedoo8409

2 жыл бұрын

@@samselikoff thanks but i happen to be on windows.

Can you explain what shortcuts you used to select your component and then wrap it with Suspense at 1:30?

How use suspense with fetch, without libraries?

@samselikoff

2 жыл бұрын

Check out the excellent suspend-react library! github.com/pmndrs/suspend-react

why dont you explain what actual "signal" Suspense component uses to detect that child component fetches something and it is in loading state?

@samselikoff

2 жыл бұрын

The child component throws a promise that resolves whenever its data fetching is complete. That's how the parent knows if it's loading (promise is in a pending state) or it's ready (promise is resolved). I talk about it some here: kzread.info/dash/bejne/eKR6x9ayqMTWpNI.html

@markokraljevic1590

2 жыл бұрын

@@samselikoff thank you

@markokraljevic1590

2 жыл бұрын

@@samselikoff so component is just a function but its not marked with async if it has await in useEffect for example, i havent looked at FC return type to know precisely... there is no concept of sync and async components, im not sure its trivial for parent component to detect pending state of the child, it requires data from inside react itself, thats why only React team could implement such component like Suspense, sorry i didn't explain this very clearly, but it frustrates me that even React docs explains how to use it without clearly explaining how it works inside, almost presenting it like its magic or black box

But you changed the design. Designers will be unhappy