show spinner only after 50ms

Question

I have a page where a lot of ajax action is taking place. I show a spinner to indicate the request is being processed.

Some of those requests long time and some of them are quick. When the response comes quickly then those spinners are more of a nuisance than an aid.

This is what I wanted. Display the spinner only if it has been more than 50ms since the request was submitted.

It means when the request is initiated spinner starts counting time. If a response comes before 50ms then response will make spinner hide.

However if response does not come in 50ms then show spinner.

Is there any plugin already out there that might help me get started.

Thanks

Answer 1

This can be easily accomplished using vanilla JavaScript. No need for a plug-in.

To show the spinner after 50ms:

var t = setTimeout("showSpinner()", 50);

And then to cancel the timeout if the call succeeds before 50ms (inside the AJAX callback):

clearTimeout(t);