LoadingDelay

Sometimes, when the request returns fast enough, the loading state may switch from false to true and back to false in a short time. At this time, the loading animation may flicker (especially for animations that occupy the entire screen), which gives the user a bad experience.

Therefore, the best approach is to set a delay value so that the loading state is only set to true after the waiting time exceeds the delay value, as shown below.

Of course, there are no absolutes in the world. If we set loadingDelay to 400ms, but in reality, my request completes in 500ms, it is still impossible to avoid flickering. Therefore, we need to introduce a new API loadingKeep.

LoadingKeep

loadingKeep can make the loading continue for a specified time.

If the request time is less than the specified time, the displayed time is the specified time.

If the request time is greater than the specified time, the displayed time is the actual request time.

We can use loadingKeep to improve the example mentioned above.

• If the request is completed within the specified time, the loading animation will not be displayed until the specified time is exceeded.
• If the loading animation is displayed, it should be displayed for at least a long enough time and not just flash by.

You can also use loadingKeep separately to make the loading last for a specified time.