useOptimistic

This hook "updates" the user interface providing a perception of zero latency. It allows you to update the UI immediately while the actual data is being fetched in the background. This can enhance the user experience by making the application feel more responsive, even when there are network delays or heavy computations involved.

In this simple example, a sleep function is used to simulate an API call with a 3-second delay in its response. Badge components are used to indicate the state of the data fetching process, changing background color immediately and updating the display text from false to true once the data has been successfully retrieved.
You can check values passed/received in the console.log.

What I've learn?

• useOptimistic

This is how the user experience should be (imho).