The useDeferredValue
Hook gives us a way to hold onto a previous resource values while waiting for a new one.
This is a more hands-on alternative to the magic of useTransition
.
With useTransition
, React "keeps" the previous rendering and gives you a magical isPending
boolean to conditionally show loading UI.
useDeferredValue
puts you in the driver seat by giving you the actual value.
This value can be used to implement our own isPending
.
The code in the 112 does not seem to be matching the videos. In the code base most of the code is found in app.js
and pokemon-detail.js
only contains the following
import React from "react";
export default function PokemonDetail({ resource }) {
let pokemon = resource.read();
return (
<div>
<div>{pokemon.name}</div>
</div>
);
}
@seetd, Thank you for the report. I'm very sorry that the repo was not in a reliable state for this lesson.
I have fixed the issue. If you pull the latest changes, you will see the lesson as it appears in the video. The problem is that I switched lesson 112 and 113 last minute.
Thank you for your patience and understanding.
The diff: https://github.com/chantastic/react-suspense-course/commit/41d88508e313b0d577d4663c01b7b4356f21d55f
Thanks for looking into this, I will try it again when I complete some other courses.