#17: Does in pend?, 2021
startTransition is a great first step for stabilizing UIs by showing a “stale” view while a next view resolves.
But stabilizing a view is just the first step. We should communicate somehow that the view is stale.
We can do that with
useTransition is an ever-so-slightly more complex hook. Like
useState, it returns a tuple with. The first argument is the pending state of the transition. The second is the same function as the
It looks like this:
That first element, that we named
isPending, is a boolean that expresses if the transition is transitioning. And we can use it selectively to add styles or elements.
In this week’s StackBlitz demo, we’ve use
isPending, and state-specific styles, to lower the opacity of the “stale” view.
The button stays interactable while the UI provides immediate feedback to the user that something is happening.
How would you take this further to provide an even better experience?