useDeferredValue Hook

[00:00:00]
>> Real quick, let's just look at the opposite, and then kind of get a sense for that. So that is great if you are in charge of who calls the function. Yeah.
>> Can we cancel or start a transition?
>> It does it under the hood. If it's something else, I don't fully know what the heuristic is, it will definitely pause it or delay.

[00:00:23]
If it's keeping track of something that like fundamentally changes what the result will be, it will throw one away, right? It's got a heuristic in place for that, I don't think we can actually step in and cancel one. But I believe it's like, if it was supposed to like rely on one of these values or something along those lines.

[00:00:40]
And those have changed, right? It'd be like, I don't need this anymore, in the same way that I will throw away entire parts of the DOM. If it feels like it is not like accurate anymore, I just refigure stuff out. You're saying this is important, but not that important, right?

[00:00:54]
And it gives you the ability to have that in place. So this will probably be the one that used, most of the time, because usually you are the one kicking off the thing. If for some reason you're receiving like a value that is coming from us, it's one of those other like, react data structures.

[00:01:14]
You can say like, I am listening on this thing. I am responding to changes in my like use memo or whatever, right? But if this is one of the ones, treat this entire thing we're doing is not important. Cuz that thing is unreliable, right? Or it's slow or something along those lines.

[00:01:29]
So the last one you were kicking it off and saying, the thing I'm about to do is problematic. Just letting you know, right? Now, you're saying like the thing I'm relying on and that dependency list, that thing over there is problematic. So like, treat me as like problematic as well.

[00:01:47]
Cool, so in that case like, we do kind of walk some of those back a little bit. And so this goes back to like, Being the filters in this case. Awesome, pull some of this out. Let's just say we couldn't do that, right? And to be clear, the other one is a lot easier to think of use cases for.

[00:02:15]
But I think, just for full due diligence, we'll have in place. So we don't have this idea. Let's say, we can't do the thing where we keep two different things. We're gonna say, this thing could change. And that is what kicked off this useMemo. But we're gonna say, yo, for putting that filters in the input fields, go for it right now.

[00:02:36]
For kicking this off, maybe chill, maybe, wait a sec. Cool, so in this case, instead of use transition, We have, No. Right, returns a deferred version of the value that may lag behind it. Commonly used to keep the interface responsive, we have something to render immediately based on user input and something that needs to wait for the data to fetch or something along those lines.

[00:03:14]
So, yeah, you can see some of this becomes useful as time goes on. While but it's immediately useful for our purposes of worrying about performance. So now, what we can do is say we've got these filters. So now, make a version of this that I am less concerned about for tricking off this useMemo, right?

[00:03:45]
This one can be problematic, I do it like later. It is going to be the same value. Yeah, like this one is pending, but the easy way to say is like, If you think about it, if the deferred filter is a value that can lag behind the real one.

[00:04:21]
Then, when they're caught up, they're the same object. But there's a moment where for the things that aren't gonna like lock up and like be problematic. That gets the new one immediately. The filter tasks which takes forever gets it when it's ready for it, you know what I mean?

[00:04:41]
So then, for a half minute, they are not the same value. But when react catches up, they're once again joined as the same value. If they do not equal each other, surely, My input field is performant. The slow thing still takes slow time, but now, I can like separate what is immediate, what is important, and what can based on like my own heuristics.

[00:05:14]
I kind of said in the beginning, sometimes it's our job to step in and be like, I know the business problem I'm trying to solve, I know what I'm doing. Let me help you out here and guide you. And now, we have some of the primitives to make that happen.