Course
React Hooks and Suspense
- 14Learn fundamentals of React Suspense3m 30s
Learn fundamentals of React Suspense
Share this video with your friends
Many components in your application will need data that has to be fetched over the network. When that data is loaded, however, you don't want to make a network request because you have the data stored in cache in the browser.
In this lesson, you will learn
- throw a
Promise - catch that
PromisewithSuspense - render that data to the browser after its loaded
- add that data to cache
Kent, could you please cover the negative scenario too? e.g. when promise rejects.
That's a great suggestion. I'll make sure to cover that in the future.
For now, you just wrap it in an ErrorBoundary and that'll catch any errors the resource throws (resources should not typically attempt to handle the error gracefully)
ErrorBoundary does help as well as wrapping a read operation in try / catch as an alternative. The problem arises if a user wants to retry fetch — that's where the issue is at the moment. Resource caches error responses and there is no way to invalidate itin the current version.
I know that cache invalidation is something that react-cache will probably handle. We'll see what it's like when react-cache is stable :)
So, I'm curious on what would be a production ready solution for the "double promise" issue and all the caveats you said...
This isn't working. I'm getting a CORs error :(